Help us build this. Leave comments, suggest improvements, and help create better design documentation for agents.
Teamleader
CRMTeamleader combines vibrant teal geometry with deep purple precision to create a business platform that feels both approachable and sophisticated. The bold Work Sans typography at extreme weights (900 for headlines, 300 for body) creates dramatic contrast that suggests confidence without intimidation, while the geometric teal shapes provide visual energy that breaks traditional corporate monotony.
Design Identity
Signature Color
Teamleader Teal
#00b2b2
energetic business growth and dynamic entrepreneurship
Visual Identity
Large geometric teal shapes that create dramatic angular compositions, combined with the extreme font weight contrast between ultra-bold headlines (900) and light body text (300) in Work Sans.
Component Style
Clean rectangular buttons with rounded corners, featuring the signature purple (#4e1fff) background. Components maintain sharp edges with subtle rounding, emphasizing functionality over decoration. No heavy shadows - relies on solid colors and clear borders for definition.
Spacing Philosophy
Generous whitespace around key elements allows the bold geometric shapes to breathe, while maintaining compact internal spacing. The layout creates dramatic focal points through asymmetrical placement of the large teal geometric elements against clean white backgrounds.
Design Principles
- Font weights are polarized: 900 for headlines, 300-400 for body text, no middle weights
- Primary purple (#4e1fff) reserved exclusively for call-to-action elements
- Teal geometry (#00b2b2) used as large-scale compositional elements, not UI details
- Work Sans font family used consistently across all text elements
- Border colors kept neutral (#babfc7) to avoid competing with signature colors
Target Audience
Growth-minded entrepreneurs and small business owners who want professional tools but reject sterile corporate aesthetics
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 | 17px | 400 | 29.75px | |
| h1 | 42px | 900 | 54px | |
| h2 | 28px | 800 | 30px | |
| p | 15px | 300 | 22px | |
| a | 15px | 300 | 22px | |
| button | 16px | 400 | 28px | |
| input | 20px | 700 | 23px | |
| nav | 14px | 400 | 20px | |
| header | 17px | 400 | 29.75px | |
| footer | 16px | 400 | 28px |
Color Palette
#00b2b2#4e1fff#babfc7#ffffff
