Cards

  1. Apps
  2. Cards

Primary transparent card title

Some quick example text to build on the card title and make up the bulk of the card's content.

Secondary transparent card title

Some quick example text to build on the card title and make up the bulk of the card's content.

Success transparent card title

Some quick example text to build on the card title and make up the bulk of the card's content.

Danger transparent card title

Some quick example text to build on the card title and make up the bulk of the card's content.

Info transparent card title

Some quick example text to build on the card title and make up the bulk of the card's content.

Warning card title

Some quick example text to build on the card title and make up the bulk of the card's content.

Card title
Card subtitle

Some quick example text to build on the card title and make up the bulk of the card's content.

Card link Another link
Card-Header

With supporting text below as a natural lead-in to additional content.

Go somewhere

With supporting text below as a natural lead-in to additional content.

Go somewhere
Card-footer
Special title treatment

With supporting text below as a natural lead-in to additional content.

Go somewhere
Special title treatment

With supporting text below as a natural lead-in to additional content.

Go somewhere
Special title treatment

With supporting text below as a natural lead-in to additional content.

Go somewhere

Contact card

Mike Rowe-Soft

Web designer

Contact card

Laura Norda

Web designer

Contact card

Willie Makit

Web designer

Contact card

Don Messwidme

Web designer

Primary card title

Some quick example text to build on the card title and make up the bulk of the card's content.

Secondary card title

Some quick example text to build on the card title and make up the bulk of the card's content.

Success card title

Some quick example text to build on the card title and make up the bulk of the card's content.

Danger card title

Some quick example text to build on the card title and make up the bulk of the card's content.

Info card title

Some quick example text to build on the card title and make up the bulk of the card's content.

Warning card title

Some quick example text to build on the card title and make up the bulk of the card's content.

Basic card

Aenean vulputate eleifend tellus. Aenean leo ligula, porttitor eu, consequat vitae, eleifend ac, enim. Aliquam lorem ante, dapibus in, viverra quis, feugiat a, tellus. Phasellus viverra nulla ut metus varius laoreet
This is Basic card footer

Basic color card-header

Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum
This is Basic card footer

Basic color card-footer

Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum
Basic card footer

Panel with custom buttons

Action 1 Action 2
No one rejects, dislikes, or avoids pleasure itself, because it is pleasure, but because those who do not know how to pursue pleasure rationally encounter consequences that are extremely painful actual teachings of the great explorer

Card with search form

No one rejects, dislikes, or avoids pleasure itself, because it is pleasure, but because those who do not know how to pursue pleasure rationally encounter consequences that are extremely painful actual teachings of the great explorer

Card with alert

Adding action was successful
Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum

Card with alert

Adding action failed
Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum

fullscreen button

Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum

Card with switch

Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum

Initial collapsed card

Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum
img
Card title

Some quick example text to build on the card title and make up the bulk of the card's content.

Go somewhere
Card title

This is a wider card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.

Last updated 3 mins ago

img
img

Some quick example text to build on the card title and make up the bulk of the card's content.

  • An item
  • A second item
  • A third item
Card link Another link

sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

so awesome this title -magna aliqua

sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

so awesome this title -magna aliqua

sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

so awesome this title -magna aliqua

Card With List

avatra-img
John Paige

Uploaded new invoices for RedBus

avatra-img
Lillian Quinn

Created new work flow for the current

avatra-img
Irene Harris

Submitted the project schedule to the manager

Sample card

Put toy mouse in food bowl run out of litter box at full speed drool but pee in Put toy mouse Put toy mouse the shoe purr when being pet but chew foot.

Scratch the postman wake up lick paw Duis aute irure dolor in reprehenderit wake up owner meow meow lick plastic bags Scratch the postman wake up lick paw wake Duis aute irure dolor having their mate disturbing sleeping humans.

Card with Toolbar

Put toy mouse in food bowl run out of litter box at full speed drool but pee in Put toy mouse Put toy mouse the shoe purr when being pet but chew foot.

Duis aute irure dolor in reprehenderit in voluptate velit Scratch the postman wake up lick paw wake up owner meow meow lick plastic bags Scratch the postman wake up lick paw wake having their mate disturbing sleeping humans.

card-with image

Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum
This is Basic card footer

card-with image

Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum
This is Basic card footer

card-with image

Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum

Card blue

Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum

Card status on left side

Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum
img
Card title

This is a wider card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.

Last updated 3 mins ago

Card title

This is a wider card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.

Last updated 3 mins ago

img
img
Card title

This is a wider card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.

Last updated 3 mins ago

img
Card title

This card has supporting text below as a natural lead-in to additional content.

Last updated 3 mins ago

img
Card title

This is a wider card with supporting text below as a natural lead-in to additional content. This card has even longer content than the first to show that equal height action.

Last updated 3 mins ago

Special title treatment 01

With supporting text below as a natural lead-in to additional content.

Go somewhere
Special title treatment 02

With supporting text below as a natural lead-in to additional content.

Go somewhere
Special title treatment 01

With supporting text below as a natural lead-in to additional content.

Go somewhere
Special title treatment 02

With supporting text below as a natural lead-in to additional content.

Go somewhere