Help us build this. Leave comments, suggest improvements, and help create better design documentation for agents.
Fetchr
LogisticsFetchr embodies a bold, logistics-forward aesthetic with oversized Clashgrotesk headlines that command attention and clean Satoshi body text that ensures readability. The palette centers around a confident ocean blue (#2f8ada) that evokes trust and reliability in delivery services, while the typography tells a story of scale and precision - perfect for a brand that moves things efficiently.
Design Identity
Signature Color
Fetchr Ocean Blue
#2f8ada
logistics reliability and digital trust
Visual Identity
Massive typographic hierarchy with Clashgrotesk headlines at 80px creating dramatic scale contrast against 20px Satoshi body text - the extreme size differential immediately signals this is a brand that thinks big.
Component Style
Clean, minimal components with sharp corners and subtle #eeeeee borders. Buttons and inputs feel weightless with no shadows, relying on the ocean blue accent color and generous 20px typography for visual impact rather than heavy styling.
Spacing Philosophy
Generous vertical rhythm driven by the large typography scale - 80px headlines demand significant breathing room, creating an airy, confident layout that lets the bold type do the talking.
Design Principles
- Headlines use Clashgrotesk at massive scales: 80px, 64px, 48px, 28px
- Body text stays consistent at 20px across all elements
- Ocean blue #2f8ada is the only accent color used
- Borders are always light gray #eeeeee, never bold
- Typography weight stays at 400-500, never heavy
Target Audience
E-commerce businesses and logistics managers who need reliable delivery partners and value straightforward, no-nonsense communication over flashy marketing.
Mood
Design descriptions are AI-generated based on visual analysis and may not fully reflect the brand's official design guidelines.
Design System
Typography Scale
| Element | Font | Size | Weight | Line Height |
|---|---|---|---|---|
| body | 20px | 400 | 26px | |
| h1 | 80px | 500 | 88px | |
| h2 | 64px | 500 | 76.8px | |
| h3 | 48px | 500 | 57.6px | |
| h4 | 28px | 500 | 39.2px | |
| p | 20px | 500 | 26px | |
| a | 20px | 400 | 26px | |
| button | 20px | 400 | 26px | |
| input | 16px | 400 | 20.8px | |
| nav | 20px | 400 | 26px |
Color Palette
#2f8ada#222222#114e0b#ffffff#eeeeee#3b0b0b#000000#5e5515
