Card Shortcode
Cards are built with as little markup and styles as possible, but still manage
to deliver a ton of control and customization. Built with flexbox, they offer easy alignment and mix well with other Bootstrap components. They have no
margin by default, so use spacing utilities as needed.
Basic Styling
Cards include various options for customizing their backgrounds, borders, and color.
Default
Some quick example text to build on the card title and make up the bulk of the card's content. Some quick example text to build on the card title.
Read moreDark
Some quick example text to build on the card title and make up the bulk of the card's content. Some quick example text to build on the card title.
Read morePrimary
Some quick example text to build on the card title and make up the bulk of the card's content. Some quick example text to build on the card title.
Read moreBordered
Some quick example text to build on the card title and make up the bulk of the card's content. Some quick example text to build on the card title.
Read moreShadowed
Some quick example text to build on the card title and make up the bulk of the card's content. Some quick example text to build on the card title.
Read moreHover shadow
Some quick example text to build on the card title and make up the bulk of the card's content. Some quick example text to build on the card title.
Read moreUsing Images
Cards include a few options for working with images. Choose from appending image caps at either end of a card or overlaying images with card content.
Image at top
Some quick example text to build on the card title and make up the bulk of the card's content. Some quick example text to build on the card title.
Read more
Card with a footer
Some quick example text to build on the card title and make up the bulk of the card's content. Some quick example text to build on the card title.
Image at bottom
Some quick example text to build on the card title and make up the bulk of the card's content. Some quick example text to build on the card title.
Read more
Background image
Some quick example text to build on the card title and make up the bulk of the card's content. Some quick example text to build on the card title.
Read more
Video/Camera
168 itemsOverlay & Scrim
Some sample of using background images in a card with different opacity of overlays and scrims. Please read the full documentation of overlays.
A scrim with 50% opacity at bottom
An overlay with 60% opacity
A 70% scrim at top
Some quick example text to build on the card title and make up the bulk of the card's content. Some quick example text to build on the card title.
Read more
Browser Top Projects
It's really easy to create a landing page for your awesome product.