Help us build this. Leave comments, suggest improvements, and help create better design documentation for agents.
Discord
Social MediaDiscord's brand identity centers on a cosmic, gaming-focused aesthetic that feels like a digital galaxy where communities thrive. The deep space gradient backgrounds with scattered stars create an immersive, otherworldly atmosphere that speaks to gamers and digital natives who live online.
Design Identity
Signature Color
Discord Blurple
#5865F2
Digital community connection - a distinctive purple-blue that signals gaming culture and online belonging
Visual Identity
The cosmic gradient backgrounds with floating UI elements and illustrated characters in a 3D isometric style - it feels like floating through a digital universe where every element has depth and personality.
Component Style
Rounded, floating components with subtle depth - buttons and cards feel like they're hovering in space with soft corners (likely 8-12px radius) and gentle shadows that give everything a weightless, approachable quality.
Spacing Philosophy
Generous breathing room with a systematic 8px grid system (4px, 8px, 16px, 24px) that creates floating, non-cramped layouts. Elements feel suspended in space rather than tightly packed.
Design Principles
- Cosmic gradients always flow from deep space blue to blurple
- Illustrated characters use isometric perspective with purple/blue color schemes
- Typography mixing custom Discord fonts with bold 56px headlines
- 8px base spacing unit with multiples for consistent rhythm
- Rounded corners never sharp - minimum 8px radius for approachability
Target Audience
Gamers, content creators, and digital community builders who value authentic online connections over corporate networking
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 | 24px | |
| h1 | 56px | 700 | 48px | |
| h2 | 22px | 700 | 17.6px | |
| h3 | 16px | 400 | 20px | |
| p | 20px | 400 | 26px | |
| a | 16px | 500 | 22px | |
| button | 16px | 400 | 24px | |
| nav | 16px | 400 | 24px | |
| header | 16px | 400 | 24px | |
| footer | 16px | 400 | 24px |
Color Palette
No colors extracted
