Help us build this. Leave comments, suggest improvements, and help create better design documentation for agents.
Polygon
Web3Polygon employs a stark, high-contrast aesthetic with deep blacks (#07060d) and clean whites, punctuated by a distinctive electric purple (#670de5). The custom Polysans typeface family creates a technical, blockchain-native feeling while the condensed 'Slimwide' variant for headlines adds geometric precision.
Design Identity
Signature Color
Polygon Electric Purple
#670de5
Web3 innovation and blockchain connectivity - a vibrant accent that cuts through the monochromatic foundation
Visual Identity
The distinctive Polysans Slimwide condensed typography for headers creates an unmistakable geometric, technical aesthetic that feels native to blockchain infrastructure.
Component Style
Clean, minimal components with subtle borders (#e1e1e5) and no heavy shadows. Buttons use Montserrat at 12px/700 weight for maximum legibility, while cards leverage soft backgrounds (#f3f3f6) with gentle contrast.
Spacing Philosophy
Precise, systematic spacing that reflects blockchain's mathematical nature. Clean separation between elements with restrained use of whitespace to maintain information density.
Design Principles
- Typography uses only Polysans family with Slimwide for headers
- Core palette limited to deep black (#07060d), clean whites, and purple accent (#670de5)
- Button text always uses Montserrat at 12px with 700 weight
- Borders use consistent #e1e1e5 stroke color
- Dark mode inverts to near-black cards (#08070e) maintaining contrast hierarchy
Target Audience
Web3 developers, DeFi protocol builders, and blockchain infrastructure teams who need enterprise-grade scaling solutions
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 | 15.9964px | 400 | 15.9964px | |
| h1 | 15.9964px | 400 | 15.9964px | |
| h2 | 96.346px | 400 | 86.7114px | |
| h3 | 35.95px | 400 | 44.9375px | |
| p | 12.9851px | 400 | 15.5822px | |
| a | 15.9964px | 400 | 15.9964px | |
| button | 12px | 700 | 12px | |
| nav | 15.9964px | 400 | 15.9964px |
Color Palette
#f2f1f5#07060d#e1e1e5#2d44a3#ddcff2#686d73#670de5#d0ced6#d7d6d9#2d2b36#c4c2c9#bab9bb
