Cards with Icons
This option represents a standard card design with a header at the top, graphic in the middle and text and link at the bottom.
Cards with Logos
Another common card format with the graphic at the top, header and text in the middle and link at the bottom.
These particular cards are smaller on the page and have the header at the top, graphic in the middle, text at the bottom, and the entire card acting as the link.
Often used to compare two products, these large cards highlight a lot of information with a header, sub-header and text at the top, image in the middle, link at the bottom, and additional callouts throughout.
Cards with Images
This is another approach to a card format with the entire card acting as the link, but with the cards overlaid on a band with a background image.
Standard Cards 1
With a background image to anchor them in place, these cards represent another approach to a common card format with a pop-out hover animation.
Standard Cards 2
Another example of a standard card with a pop-out hover animation and overlapped with a header video.
These cards are unique in that they only have a header, image and button and they tilt depending on where you hover over them, making them more engaging.
Cards With Icons 2
With the header serving as the button and a subtle hover animation, these cards offer a simple way to introduce a lot of information.
Cards with Images 2
This setup uses cards to call out specific news and promotions that the company wants to emphasize to its customers.
Another approach to introducing a lot of information in a simplistic way, with the header and icon overlaying the background image.
Cards With Images 3
Another version of a standard card with the image at the top, header in the middle and text and link at the bottom.
Cards With Icons
These particular cards don’t link to another section of the website, but instead simply bring attention to the specific information that they display.
This option presents the information as a block of text that reveals the card with a pop-out effect when you hover over the text.
Explainer Cards 2
Often used to explain multiple steps in a process, these cards are large and text heavy to entice the reader to find out more about a specific step.