Skip to main content

Card

Card — Prism component.

Signature
Density
Viewport
Theme follows the navbar ☀/☾ toggle
Live demo
Open ↗

When to use

Card — Prism component.

Accessibility

Fully keyboard operable: Tab to focus, Enter/Space to activate. The visible focus ring uses --focus-ring — never remove it. Provide an accessible label (aria-label) for icon-only controls.

Import

const { Card } = window.PrismDesignSystem_39d121;

Props

PropTypeRequiredDescription
paddedbooleanApply internal padding. Default true.
isInteractivebooleanMake the whole card a keyboard-focusable button target.
onPress(e: React.SyntheticEvent) => void
childrenReact.ReactNode
classNamestring