Stripe — Hero
Full-width hero section with centered headline, supporting subtext, and dual CTA buttons anchoring a left-aligned hero image. The hero transitions into a live pricing preview mockup below showing three-tier pricing cards with a highlighted "Best value" badge on the middle tier, flanked by a vibrant purple-to-pink gradient wave.
This is a static, crawlable rendering for search & AI engines. The interactive version — filters, live decode console, copy & export — is at https://mozaika.design/inspiration/stripe-editorial-hero-with-customer-story-card-mosaic.
Measured spec
| Scheme | light |
| Background | #FFFFFF |
| Text | #BD6FAD |
| Accents | #BD6FAD |
| Contrast | 3.48 |
| Columns | 1 |
| Alignment | left |
| Whitespace | regular |
| Density | 0.172 |
| Measured size | 1600×1441 px |
Palette
#6366f1#8b5cf6#ff6b6b#ff8a65#ffffff
Fonts
Söhne
Page types
Detail
UX patterns
Pricing ToggleUpgrade Prompt
UI elements
Navigation BarPricing CardBadge
Context
Other sections on this page
- Feature — The opportunity—two-column value proposition with heading and descriptive text
- Feature — Subscriptions feature with product preview
- Feature — Multi-panel feature showcase with usage meter and invoice examples
- Feature — Feature cards with collapsible accordion
- Feature — Stripe Billing features and platform capabilities with categorized lists
- Feature — Revenue cycle optimization with four-column feature layout
- Gallery / Showcase — Three-column resource cards with guides and reports