Help us build this. Leave comments, suggest improvements, and help create better design documentation for agents.
Sanofi
HealthcareSanofi projects pharmaceutical gravitas through cinematic hero imagery paired with elegant, scientific precision. The design balances human warmth with clinical authority, using deep purples that evoke both medical expertise and innovation.
Design Identity
Signature Color
Sanofi Medical Violet
#7a00e6
pharmaceutical innovation and medical excellence - bridging scientific precision with human care
Visual Identity
Dramatic full-screen hero sections with architectural or urban imagery overlaid with poetic, italicized messaging that positions science as aspirational rather than purely clinical.
Component Style
Refined buttons with subtle rounded corners (4-8px), clean borders, and restrained use of shadows. Components feel substantial but not heavy - medical-grade precision without sterility.
Spacing Philosophy
Generous whitespace creates breathing room that feels premium and considered. Large hero sections with ample padding suggest confidence and authority, while tight component spacing maintains efficiency.
Design Principles
- Border radius stays between 4-12px for medical precision
- Typography uses bold weights (700) for headlines, regular (400) for body
- Purple brand color (#7a00e6) reserved for primary actions and brand moments
- Hero sections always feature large-scale photography with text overlay
- Navigation remains minimal and unobtrusive
Target Audience
Healthcare professionals, pharmaceutical researchers, and medical industry stakeholders who value scientific credibility paired with human-centered innovation
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 | 48px | 700 | 72px | |
| h2 | 36px | 700 | 54px | |
| h3 | 24px | 700 | 36px | |
| h4 | 18px | 700 | 22.5px | |
| p | 14px | 400 | 21px | |
| a | 16px | 400 | 24px | |
| button | 16px | 400 | normal | |
| nav | 16px | 400 | 24px | |
| header | 16px | 400 | 24px |
Color Palette
#5d5d5d#faf5ff#23004c#5718b0#7a00e6#ffffff#c9c9c9#e4e4e4#000000#171717#1570ef#175cd3
