Help us build this. Leave comments, suggest improvements, and help create better design documentation for agents.
Unacademy
EdTechUnacademy's brand radiates warmth and accessibility through its distinctive warm cream background (#fff4e5) and playful illustrated characters, creating an inviting learning atmosphere. The AvertaStd typography paired with rounded, friendly UI components tells a story of approachable expertise - serious education made welcoming.
Design Identity
Signature Color
Unacademy Warm Cream
#fff4e5
Educational warmth and approachability - like studying in a cozy, well-lit space
Visual Identity
The warm cream background with vibrant, diverse illustrated characters in circular frames creates an instantly recognizable learning community aesthetic that feels human and inclusive.
Component Style
Softly rounded corners (6-8px radius) with subtle shadows and gentle borders. Components feel cushioned and friendly rather than sharp or clinical - buttons have a welcoming weight with generous padding.
Spacing Philosophy
Generous vertical breathing room between major sections creates an unhurried learning pace, while moderate internal spacing keeps the interface approachable rather than overwhelming.
Design Principles
- Warm cream (#fff4e5) as primary background for comfort
- AvertaStd typography exclusively for brand consistency
- Rounded corners never exceed 8px for friendly feel
- Purple accents (#7f6efc) for interactive elements
- Illustrated characters always in circular frames
Target Audience
Ambitious Indian students and young professionals seeking accessible yet serious exam preparation and skill development
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 | 18.4px | |
| h1 | 48px | 700 | 56px | |
| h2 | 32px | 700 | 40px | |
| h3 | 24px | 700 | 32px | |
| h4 | 20px | 700 | 26px | |
| h5 | 16px | 600 | 24px | |
| p | 14px | 600 | 21px | |
| a | 12px | 400 | 18px | |
| button | 14px | 500 | 24.5px | |
| input | 14px | 400 | 7px |
Color Palette
#fcfcfc#ffffff#f7f9fb#3c4852#7a8b94#a6b3ba#e9eef2#dde6ed#000000#f0f4f7#1e2429#fef5f5
