All Text Card. Notice how this card stays the same height as its siblings and this text is vertically centered (at desktop sizes). This keeps layouts looking consistent no matter what type of content occupies each sibling card. Andy Paddock May 02
Photo on Top + 33.3% Width. The markup for this card is identical to that for the 50% Width article above. Andy Paddock May 02
Background Photo + 30% Dark Overlay A much lighter overlay work on darker photos, and is easy to control with utilities. Andy Paddock May 02
Background Photo + 80% Dark Overlay. It’s easy to add a background image for the entire card, plus make text more legible by adding an overlay across the background with simple utility classes. These are all generated from the theme’s variables! Andy Paddock May 02
Background Photo + Gradient Overlay. This blog card example shows a background image, but instead of an even wash across the entire background, it’s a gradient from right to left controlled by another simple utility class. Andy Paddock May 02
