Cascading cards:

Add .card-cascade to the .card to achieve cascading effect. You can manipulate the width of the image by adding .card-cascade-wider or .card-cascade-narrower class to the .card.

Wider:
Card image cap
Card title

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

Card link Another link
Narrower:
Card image cap
Card title

Lorem ipsum dolor sit amet, quis commodi eveniet ex tempore. Asperiores voluptates fugit, quod quibusdam iure sit modi..

Card link Another link
Regular:
Card image cap
Card title

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

Card link Another link

Image overlay:

Card image
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 image
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 Group:

Card image cap
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 image cap
Card title

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

Last updated 3 mins ago

Card image cap
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


Card decks:

Need a set of equal width and height cards that aren’t attached to one another? Use card decks.

Card image cap
Card title

This is a longer 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 image cap
Card title

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

Last updated 3 mins ago

Card image cap
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

Default Cards:

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 image cap

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

Card image cap
Card title

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

Card link Another link