Rokkit 1.0.3

Card

Container card component for organizing content

The Card component provides a container with structured layout zones for header, body, and footer content. It can render as a plain container, a clickable element, or a link.

Basic Example

Cards can hold any content, link to URLs, or handle click events:

No preview available
Example
Highlighting code...

Header & Footer Snippets

Use the header and footer snippets to add structured sections with consistent spacing and dividers.

No preview available
Example
Highlighting code...

Properties

Core Properties

  • href: Render as a link
  • onclick: Click handler
  • class: Custom CSS classes

Snippets

  • header: Card header area
  • footer: Card footer area
  • children: Card body (default slot)