Help us build this. Leave comments, suggest improvements, and help create better design documentation for agents.
Employment Hero
HR TechEmployment Hero commands attention with ultra-bold Saiga typography that screams confidence, balanced by clean DM Sans body text. The vibrant purple (#9b51e0) creates an energetic, forward-thinking atmosphere that feels both professional and disruptively modern.
Design Identity
Signature Color
Hero Purple
#9b51e0
AI-powered innovation and intelligent automation in HR tech
Visual Identity
Massive, black ultra-bold headlines (900 weight) that dominate the screen with commanding presence, creating an unmistakable typographic hierarchy that feels like a tech manifesto.
Component Style
Pill-shaped buttons with generous rounded corners and vivid purple backgrounds. Clean, shadowless design with smooth curves that feel approachable yet sophisticated - no harsh edges or aggressive borders.
Spacing Philosophy
Generous breathing room around hero elements with expansive whitespace that lets the bold typography breathe. Intimate padding within interactive elements creates comfortable touch targets without visual clutter.
Design Principles
- Headlines use Saiga at 900 weight for maximum impact
- Body text stays at DM Sans 600 weight for readability
- Primary actions use vibrant purple (#9b51e0) exclusively
- Buttons maintain pill-shaped radius around 24px+
- Shadows are reserved for depth, not decoration
Target Audience
HR directors and business owners who want cutting-edge AI automation but need enterprise reliability
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 | 24.8px | |
| h1 | 80px | 900 | 85px | |
| h2 | 42px | 900 | 48.006px | |
| h3 | 28px | 900 | 32.004px | |
| p | 16px | 600 | 24.8px | |
| a | 12px | 700 | 20.04px | |
| button | 12px | 600 | 20.04px | |
| input | 13.3333px | 400 | normal | |
| header | 16px | 400 | 24.8px | |
| footer | 16px | 400 | 24.8px |
Color Palette
#007cba#006ba1#005a87#7a00df#000000#abb8c3#ffffff#f78da7#cf2e2e#ff6900#fcb900#7bdcb5
