Card — Playground

px

Card heading

Grouped content with Kikita border, radius, and surface tokens.

appearance
size
State
html.html
<article kuiCard>
  <h2>Card heading</h2>
  <p>Grouped content with Kikita border, radius, and surface tokens.</p>
</article>
NameTypeDefaultDescription
appearance'surface' | 'elevated' | 'sunken''surface'Visual surface treatment: flat surface, elevated shadow, or sunken inset.
size'xs' | 'sm' | 'md' | 'lg''md'Card padding size, mapped to the shared Kikita size scale.
interactivebooleanfalseEnables hover and focus-visible affordances for clickable cards. Does not add semantics or keyboard behavior; choose an interactive host element (button, a) for that.

Inputs verified against @kikita-labs/ui v1.6.1 v1.6.1 public typings.