Coda — Hero
Light blue gradient background with a large centered headline "Your team can do a lot for free." followed by a primary CTA button. Clean, minimal layout with ample whitespace and subtle background patterns.
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/coda-peach-hero-with-all-in-one-headline-product-doc-mockup.
Measured spec
| Scheme | light |
| Background | #D6F4FF |
| Text | #084D9A |
| Accents | #084D9A, #759EC1, #152F4B |
| Contrast | 7.19 |
| Columns | 1 |
| Alignment | left |
| Whitespace | dense |
| Density | 0.584 |
| Measured size | 1600×733 px |
Palette
#D4E8F7#1E3A5F#FFFFFF#1A1A1A#0052CC
Fonts
Inter
Page types
Detail
UX patterns
Upgrade Prompt
UI elements
Navigation BarFloating Action Button
Context
- Parent page: Coda four-tier pricing page with Maker-Billing model and exhaustive feature comparison matrix
- All of Coda
Other sections on this page
- Feature — Role-based feature comparison with pricing tiers
- Pricing / Plans — Four-tier pricing cards with toggle and comparison table
- Comparison — Pricing tier comparison table with feature rows
- Comparison — Collaboration and Sharing Features Comparison Table
- Comparison — Tiered feature comparison table with four plan levels
- FAQ — FAQ section with expandable accordion questions
- FAQ — Collapsible FAQ about Coda AI pricing and credits
- FAQ — Pricing and billing FAQ accordion
- Footer — Multi-column navigation footer with legal links and social icons