Svelte Material UI

Cards

Installation
npm i -D @smui/card
Demos
A simple padded card.
You can also use Content.
An outlined, padded card.
With Actions
Primary Action, a clickable area of the card.
A card with action buttons.
A card with a full-bleed action.
A card with action icons.
A card with Both.
Clicked: 0
With Media

A card with 16x9 media.

Here's some gray text down here.

A card with square media.

And a subtitle.

A card with media.

And a subtitle.

And some info text. And the media and info text are a primary action for the card.
Clicked: 0
With a List
  • A card with a list as content.
  • Item #1
  • Item #2
  • Item #3
  • Item #4
  • Item #5
  • Clicked: 0
    Complex

    A card with media.

    And a subtitle.

    It's all in this card. It's a veritable smorgasbord of card features.

    A card with media.

    And a subtitle.

    It's all in this card. It's a veritable smorgasbord of card features.
    Clicked: 0