Gradient CTA
A centered call to action set on a vivid gradient panel with a headline and button. A bright closing section for a homepage or feature page.
A centered call to action set on a vivid gradient panel with a headline and button. A bright closing section for a homepage or feature page.
Search blocks by description or jump to a page.
Gradient CTA is a centered call to action set on a soft gradient wash that fades across the section background. At the top sits a small pill badge with a sparkle icon and a short label announcing something new. Below it a large headline and a supporting paragraph describe the offer. Two buttons sit side by side at the bottom: a solid primary button and a lighter outlined button for a secondary path.
All four pieces are independent. You can rewrite the badge text or remove the badge entirely, swap the headline and supporting copy for your own message, and relabel both buttons to match the actions you want visitors to take.
This block suits any moment near the end of a developer tools page where you want to convert a reader who has already scanned the feature list and is weighing an upgrade or a plan comparison. The gradient wash creates a visual break without the weight of a full image or a dark panel, which keeps the page feeling light and code focused. It works better than a plain centered block when you need that soft visual emphasis, and better than a split layout when the message stands on its own without a product screenshot.
A natural flow around it on a Marketing (Legacy) page:
Before
After
The block has three distinct layers you can adjust independently:
Tip: keep the badge label short enough to read in one glance. Four to six words is the practical limit before the pill grows too wide on mobile.