Help us build this. Leave comments, suggest improvements, and help create better design documentation for agents.
Hollister
FashionHollister embodies a coastal California aesthetic with dreamy, layered imagery and sun-drenched tones that evoke endless summer vibes. The PF DIN Max typography creates a contemporary, sporty feel while maintaining approachability, perfectly balancing youthful energy with refined simplicity.
Design Identity
Signature Color
Pacific Blue
#4e6f84
ocean-inspired wanderlust and California coastal lifestyle
Visual Identity
Split-screen hero layouts showcasing lifestyle photography with natural lighting, shadow play, and authentic poses that feel more like editorial fashion than traditional retail imagery
Component Style
Clean, minimal components with subtle 8-12px rounded corners and understated styling - buttons and UI elements never compete with the hero imagery, maintaining an almost invisible interface aesthetic
Spacing Philosophy
Generous whitespace creates breathing room around lifestyle imagery, with tight 10-20px padding on interactive elements to maintain focus on the aspirational photography
Design Principles
- Border radius stays between 6-16px for subtle softness
- Typography uses PF DIN Max exclusively for brand consistency
- Hero imagery always dominates with minimal UI overlay
- Color palette draws from coastal/natural tones
- Interactive elements use minimal visual weight
Target Audience
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 | 12px | 400 | 18px | |
| h2 | 15px | 700 | 75px | |
| h3 | 14px | 600 | 14px | |
| p | 12px | 600 | 15px | |
| a | 14px | 600 | 16px | |
| button | 10px | 400 | normal | |
| input | 13.3333px | 400 | normal | |
| nav | 12px | 400 | 18px | |
| header | 12px | 400 | 18px | |
| footer | 12px | 400 | 18px |
Color Palette
#7d7a74#4e6f84#fcfcfa#233b4d#6c6c6a#c6391e#f2f0ec#f5bd02#ffffff#257717#d2d0ce#60b054
