# Card
[component-header:sl-card]
Cards can be used to group related subjects in a container.
```html preview
Mittens
This kitten is as cute as he is playful. Bring him home today!
6 weeks old
More Info
```
## Examples
## Basic Card
Basic cards aren't very exciting, but they can display any content you want them to.
```html preview
This is just a basic card. No image, no header, and no footer. Just your content.
```
## Card with Header
Headers can be used to display titles and more.
```html preview
```
## Card with Footer
Footers can be used to display actions, summaries, or other relevant content.
```html preview
```
## Images
Cards accept an `image` slot. The image is displayed atop the card and stretches to fit.
```html preview
This is a kitten, but not just any kitten. This kitten likes walking along pallets.
```
[component-metadata:sl-card]