DESIGN KIT
High Root Open Air · Brand Guidelines 2026
01 — Farben
Background Primary
Haupthintergrund
#0a0a0a·--festival-bgBackground Surface
Karten & Panels
#150f1a·--festival-surfaceBackground Surface Light
Hover States
#1f1728·--festival-surface-lightOrchid / Accent Primary
Primary CTA, Links, Highlights
#c97fd4·--festival-accentTeal / Accent Secondary
Sekundärer Akzent, Tags
#4bc4b8·--festival-accent-tealDeep Purple
Kräftiger Violett-Akzent
#6b35a8·--festival-accent-purpleLime / Energy
Energie, Highlights, Icons
#c8e84a·--festival-accent-limeSalmon / Warm
Wärme, Tags, Details
#d4917a·--festival-accent-salmonText Primary
Überschriften, Haupttext
#ffffff·--festival-textText Muted
Sekundärtext, Labels
#a0a0a0·--festival-text-mutedText Dim
Subtext, Metainfo
#808080·--festival-text-dimBorder
Rahmen, Trennlinien
rgba(255,255,255,0.1)·--festival-border02 — Typografie
Display / Hero Font
HORIZON
OUTLINED
font-family: 'Horizon' / 'Horizon Outlined'Für alle Hero-Überschriften, Sektions-Titel, Event-Namen
Body / UI Font
System Sans
-apple-system, BlinkMacSystemFont, "Segoe UI"Für Fließtext, Labels, Buttons, UI-Elemente
High Root 2026
HORIZON FontLineup & Artists
HORIZON FontElectronic Music
HORIZON FontFernando – DJ
Das High Root Open Air ist ein Festival der Verbundenheit und Musik.
Unser Festival vereint elektronische Musik, Natur und Community.
LINEUP · LOCATION · 2026
© 2026 High Root Open Air · Impressum · Datenschutz
03 — Gradienten
Hero Overlay
Bild-zu-Hintergrund
bg-gradient-to-b from-transparent via-[#0a0a0a]/50 to-[#0a0a0a]Orchid → Purple
Primärer Marken-Gradient
bg-gradient-to-r from-[#c97fd4] to-[#6b35a8]Teal → Lime
Energie / Highlights
bg-gradient-to-r from-[#4bc4b8] to-[#c8e84a]Purple → Salmon
Warm / Event Cards
bg-gradient-to-r from-[#6b35a8] to-[#d4917a]04 — Buttons & CTAs
Primary CTA (Orchid → Lime)
Secondary (→ Teal)
Deep Purple CTA
Lime CTA (→ Salmon)
Outline
Tags / Badges
05 — Abstände (Spacing Scale)
06 — Radien & Rahmen
rounded-lg8pxrounded-xl12pxrounded-2xl16pxrounded-full9999px07 — Karten & Komponenten
Artist Name
Taunusstein · House
Event Info
Datum
Samstag, 13. Juni 2026
Location
Taunusstein
Hinweis
Info Box mit Teal-Border
Achtung
Warning / Error State
08 — Logo & Assets
Logo-Varianten
Farb-Logo
Primäre Verwendung auf dunklem Hintergrund
Farb-Logo auf Weiß
Auf hellem Hintergrund
Weiß-Logo
Einfarbig weiß – für dunkle Flächen & Print
Dark-Logo
Einfarbig dunkel – für helle Flächen & Print
Icon / Signet
Farb-Icon
App-Icon, Social Media Avatar, Favicon
Icon auf Schwarz
Für dunkle Kontexte
Icon auf Gradient
Nicht empfohlen – nur als Ausnahme
Mindestgröße
64px
Digital groß
40px
Navigation / Header
24px
Minimum
Mindesthöhe: 24px — darunter wird das Logo unleserlich.
Dos & Don'ts
✓Richtige Verwendung
- ✓Logo auf dunklem (#0a0a0a) oder weißem Hintergrund verwenden
- ✓Ausreichend Freiraum um das Logo lassen (mind. Logohöhe × 0.5)
- ✓Originale Proportionen beibehalten – niemals strecken oder verzerren
- ✓Bei kleiner Darstellung die Mindestgröße von 24px Höhe einhalten
- ✓Originalfarben oder Vollweiß bei Einfarbigkeit verwenden
✕Verbotene Verwendung
- ✕Logo nicht auf unruhigen Fotohintergründen ohne Overlay verwenden
- ✕Keine Farbveränderungen am Logo vornehmen (z.B. Einfärben mit Akzentfarben)
- ✕Logo nicht drehen, spiegeln oder perspektivisch verzerren
- ✕Keine Schatten, Glows oder Filtereffekte auf das Logo anwenden
- ✕Logo nicht beschneiden oder einzelne Elemente isoliert verwenden
Schutzzone (Clear Space)
Um das Logo herum muss immer ein Mindestabstand freigehalten werden. Dieser entspricht der Hälfte der Logohöhe auf jeder Seite.
09 — Font Downloads
High Root Open Air · Brand Guidelines
Version 2026 · Brand Guidelines