Multi Column Cards
A promo arranged as several cards in columns, each holding its own offer. Presents multiple deals or categories side by side on one store page.
A promo arranged as several cards in columns, each holding its own offer. Presents multiple deals or categories side by side on one store page.
Search blocks by description or jump to a page.
Multi Column Cards opens with a centered heading and a short supporting line, then drops into a three column grid of cards. Each card stacks a fixed height image, an optional badge pinned to the top right corner of the image, a title, a short description, and a ghost button with an arrow in a lightly tinted footer row. The cards grow to equal height so the row stays visually balanced regardless of copy length.
Every part of each card is independent. You can change the heading and subtext, swap the image, set or remove the badge, adjust the badge style, and rewrite the title, description, and button label without affecting the other cards. The grid defaults to three cards but you can add or remove items and the columns reflow responsively down to a single column on narrow screens.
Reach for this block when you need to surface several distinct offers or categories in one section without forcing a choice. On an HR and hiring platform, for example, it works well to promote a job posting plan, a sourcing tool upgrade, and a featured employer badge side by side so visitors can self select. It works harder than a single centered promo when you have two or more offers of roughly equal weight, and it gives each card more breathing room than a compact list row.
A natural flow around it on an Ecommerce page:
Before
After
Each card is a self contained promo slot, so you can fill the grid with whatever mix of offers fits the moment:
Tip: keep all three card descriptions to one or two short sentences so the footer buttons stay vertically aligned across the row.