Help us build this. Leave comments, suggest improvements, and help create better design documentation for agents.
KAYAK
TravelKAYAK's brand exudes confident, travel-savvy optimism through its signature orange that feels like a warm sunset paired with TT Hoves Variable typography that's both approachable and authoritative. The design speaks to experienced travelers who value efficiency over flashiness, creating a sense of reliability through its balanced, functional aesthetic.
Design Identity
Signature Color
KAYAK Orange
#FF6900
adventure-ready confidence and travel expertise
Visual Identity
The distinctive orange accent color system combined with generous whitespace and the iconic tabbed navigation pattern creates instant recognition - even without the logo, the orange Search button and clean layout hierarchy are unmistakably KAYAK.
Component Style
Moderately rounded corners (8px cards, 4px buttons) with subtle shadows and clean borders. Components feel substantial but not heavy - the orange Search button has confident weight while input fields maintain crisp, professional edges with minimal visual noise.
Spacing Philosophy
Generous breathing room with the hero search interface commanding center stage, surrounded by ample whitespace. The layout uses strategic density - tight within components but expansive between sections to create focus without claustrophobia.
Design Principles
- Orange accent color reserved exclusively for primary actions
- Border radius never exceeds 8px for cards, 4px for buttons
- Typography uses TT Hoves Variable with maximum 3 weights: 400, 600, 700
- Shadow system uses subtle layering with rgba opacity never exceeding .35
- Button text always 14px with normal line-height for consistency
Target Audience
Frequent leisure and business travelers aged 28-45 who prioritize comprehensive comparison shopping and appreciate streamlined booking workflows 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 | 16px | 400 | 19.696px | |
| h1 | 20px | 400 | 24px | |
| h2 | 44px | 700 | 56px | |
| h3 | 14px | 600 | 20px | |
| h4 | 14px | 600 | 20px | |
| p | 14px | 400 | 20px | |
| a | 16px | 400 | 19.696px | |
| button | 14px | 400 | normal | |
| input | 16px | 400 | 18.4px | |
| nav | 16px | 400 | 19.696px |
Color Palette
#a0afba#15844b#647582#08b1dd#f9fafb#0b7b99#ffffff#97e2f7#cc2255#f3f5f7#000000#212a30
