CTA with Cards
Figma Component: 27050:246494
GitHub Issue: #268
Dark section with centered kicker, title, and CTA button, followed by three link cards, each with a background image, title, and arrow icon.
Functional Documentation
| Role | Scenario | Description |
|---|---|---|
| system | Display section text | Shows small title, section title, and CTA button, centered above the cards. |
| system | Display cards | Shows three cards in a row, each with a background image, title, and arrow icon. |
| system | Stack on mobile | Cards stack vertically instead of sitting in a row. Section text and CTA button remain centered above the cards. |
| editor | Configure section text | Set small title, section title, and CTA button with label and URL. |
| editor | Configure cards | Card count is fixed at three. Each card has a background image, title, and destination URL. |
| user | Click CTA button | Navigates to destination URL. Shows hover state on hover. |
| user | Click card | Navigates to destination URL. Shows hover state on hover. |
Properties
Responsive (Variant)
| Value | Example |
|---|---|
| Desktop |  |
| Mobile |  |