Brand Guidelines
Our Brand.
Everything you need to represent Till Freitag correctly – logo, colors, typography, and rules.
Logo
Our logo is the central identifier. Always use it with sufficient clearance and never alter it.
Colors
The color palette defines our visual identity. All colors are defined in HSL and available as design tokens.
Primary Blue
#3264fa
224 96% 59%
Hauptfarbe, Links, Headlines
Turquoise
#40eee6
177 82% 59%
Akzente, Badges, Hover-Effekte
Yellow
#ffcc00
48 100% 50%
CTAs, Highlights
Navy
#1a2744
224 50% 20%
Dark Sections, Footer
Warm Black
#3c3c3c
0 0% 24%
Fließtext
Typography
Montserrat is our only typeface – for headlines and body text. Consistent weight hierarchy is key.
Montserrat
Aa Bb Cc 123
The quick brown fox jumps over the lazy dog.
| Weight | Preview | Use case |
|---|---|---|
| 700 (Bold) | Montserrat | Main headlines (H1, H2) |
| 600 (Semibold) | Montserrat | Buttons, badges, subheadings |
| 500 (Medium) | Montserrat | Navigation, labels |
| 400 (Regular) | Montserrat | Body text, descriptions |
Do's & Don'ts
Do's
- Use the logo with sufficient white space
- Only use Montserrat as typeface
- Use semantic color tokens (bg-primary, text-foreground)
- Use HSL values for all colors
- Check contrast in light & dark mode
Don'ts
- Distort, rotate, or recolor the logo
- Mix other typefaces
- Use hardcoded hex values in components
- Use Playfair Display in UI
- Use CTA yellow for backgrounds