Help us build this. Leave comments, suggest improvements, and help create better design documentation for agents.
DocPlanner
HealthcareDocPlanner embodies healthcare professionalism through ultra-light typography and expansive whitespace, creating a sense of calm accessibility. The Work Sans light-weight headings communicate medical authority without intimidation, while the minimalist layout suggests transparency and trust in healthcare technology.
Design Identity
Signature Color
DocPlanner Teal
#00B39B
healthcare trust and digital wellness - balancing medical credibility with approachable technology
Visual Identity
Extreme typographic restraint with 300-weight headings across all sizes, creating an almost whisper-light hierarchy that feels distinctly medical-professional yet digitally native.
Component Style
Invisible-weight components that barely register visually - likely ghost buttons with minimal borders, rounded corners around 6-8px, and hover states that gently intensify rather than transform. Everything feels like it's designed to reduce patient anxiety.
Spacing Philosophy
Cathedral-like spacing with generous 48-64px vertical rhythms that create breathing room, mimicking the calm, unhurried pace of quality healthcare consultations.
Design Principles
- All headings use 300 font-weight regardless of size
- Typography split between Work Sans (display) and Roboto (interface)
- Line heights consistently 2x larger than font sizes for maximum readability
- No typography exceeds 34px to maintain approachable scale
- Interface text locked at 16px for accessibility compliance
Target Audience
Patients and healthcare providers who prioritize trust and transparency over flashy marketing - people making serious health decisions who need calm, credible interfaces.
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 | 20.8px | |
| h1 | 34px | 300 | 68px | |
| h2 | 24px | 300 | 28.8px | |
| h3 | 29.5385px | 300 | 38.4px | |
| h4 | 16px | 300 | 20.8px | |
| p | 16px | 400 | 28px | |
| a | 34px | 300 | 68px | |
| button | 16px | 400 | 20.8px | |
| nav | 16px | 400 | 20.8px | |
| header | 16px | 400 | 20.8px |
Color Palette
No colors extracted
