Card
A sl-card component is a simple rounded box that contains various other components.
html
<sl-card>
<span>Card Title</span>
</sl-card>Slots
The component includes multiple slots to cover various layouts.
Playground
html
<sl-card>
<span slot="header">Header Slot</span>
<span>Default Slot</span>
<span slot="footer">Footer Slot</span>
</sl-card>Modifiers
Adding those boolean attributes allows to modify the card styling.
Variants
Sizes
html
<!-- Variants -->
<sl-card>...</sl-card>
<sl-card danger>...</sl-card>
<!-- Size -->
<sl-card small>...</sl-card>
<sl-card medium>...</sl-card>