Marke & Standards – Visuelle Identität & Markenrichtlinien
Logo, Schriftarten, Farben und Kommunikationston — alles an einem Ort
Logo
Primärlogo (horizontal)
Wird in Kopfzeile, Fußzeile, E-Mail-Signatur und auf hellen Hintergründen verwendet.
Inverses Logo
Wird auf dunklen Hintergründen verwendet.
Logo-Marke (Icon)
Wird als Favicon, PWA-Icon und überall dort verwendet, wo kein Text benötigt wird.
Verwendungsregeln
- Freiraum um das Logo in mindestens Marker-Breite einhalten
- Farben nicht ändern
- Nicht auf unruhigen Hintergründen platzieren
- Invers-Version auf dunklen Hintergründen verwenden
Palette
| Token | Hell | Dunkel | Zweck |
|---|---|---|---|
| surface | #f8f6f3 | #0a0a0a | Seitenhintergrund |
| surface-alt | #eae7e2 | #1c1a18 | Alternativer Hintergrund |
| text-heading | #1c1a18 | #f8f6f3 | Überschriften |
| text-body | #4a443f | #b0aba4 | Fließtext |
| accent | #0d9488 (teal) | #2dd4bf | CTA, Links, Akzente |
| secondary | #d97706 (amber) | #fbbf24 | Sekundärer Akzent |
Typografie
| Rolle | Schriftart | Gewicht |
|---|---|---|
| Überschrift | Space Grotesk | 400–700 |
| Text | Inter | 300–700 |
| Code/Mono | JetBrains Mono | 400–500 |
Kommunikationston
| Situation | Ansatz |
|---|---|
| Hero | “Wir bewahren Geschichten. Wir bauen Systeme.” |
| Leistungen | Was, wie, wie viel — keine Geheimnisse |
| Portfolio | Hier ist, was wir gebaut haben, hier ist, wie |
| Kontakt | “Kontaktieren Sie uns. Kaffee und schauen, was Sie brauchen.” |
| Rechtliches | Sauber, klar, fair |
Stack
| Ebene | Technologie |
|---|---|
| CSS | Tailwind v4 |
| JS | Alpine.js 3 |
| Deploy | FTP / SSH |
Version: 1.0 | Mai 2026