Brand
Changelog v1.4

Card

Cards group related content and actions into a contained, visually distinct layout.

Basic Card

This is a basic card with some content. Cards can contain any type of content.

Card with Header & Footer

Card Title
This card has a header and footer to structure the content hierarchy.
Action

Card Grid

Analytics
View real-time metrics and performance dashboards.
Reports
Generate and export detailed business reports.
Settings
Configure preferences and system options.

Usage

<sl-card>
  <div slot="header">Title</div>
  Card content goes here.
  <div slot="footer">
    <sl-button variant="primary">Action</sl-button>
  </div>
</sl-card>