Image on Top Cards
This card style is called "Card: Image on Top". The image is always on the top of the card, and editors can display or hide the drop shadow around the card.
1 Min Read
This card style is called "Card: Image on Top, Large". The large image is always on the top of the card, and editors can display or hide the drop shadow around the card. Although this module can live as inside any list or container style, it typically works best in the two-column uneven split (30 / 70, or 70 / 30) in the wider side of the container
1 Min Read
Image Only Cards
The two cards below are Card Image, Large (L) and Card Image Only (R). They are two variations on a card that only displays the image, no title or description. The use case here if you want to display an image that clicks out to a link. The Card Image, Large works best in the wider side of a two-column container.
Additional Card Styles
Here are additional Cards that can live independently, inside a list, OR a container. There are overrides that exist for each style, so you can change them up to be a little unique.
This card style is called "Card: Background". The Promo image can become the background, OR, as you see in this example, or you can pick hex values to become your background color. These are great to display metrics that you want to POP. This style also has an extra control for the vertical alignment, so you can either top, center or bottom align your text to fill out the card space as you wish.
This card style is called "Card: Logo on Bottom". The logo image is at the bottom of the card, and editors can left or right align the image and the text. The background for this card can either be an image or a hex value.
1 Min Read
This card style is called "Card: Icon on Top, Large". The icon image is at the top of the card, and editors can left or right align the image and the text. The background for this card can either be an image or a hex value.
1 Min Read
This card style is called "Card: Text Only". The image associated with any linked content will not appear, so if you'd like the image to show, you'll need to pick a different style. You can change the background color of this card, as well as the top bar color. You can also choose to hide the button and also hide the top bar to make it a little less dramatic.
1 Min Read
This card style is called "Card: Image on Side, Extra Small". The logo image is at the side of the card, and editors can left or right align the image and the text. The background for this card can either be an image or a hex value.
This card style is called "Card: Logo on Top". The logo image is on the top of the card, and editors can left or right align the image and the text. The background for this card can either be an image or a hex value.
1 Min Read
This card style is called "Card: Icon on Top, Small". The icon image is at the top of the card, and editors can left or right align the image and the text. The background for this card can either be an image or a hex value.
1 Min Read
