This page is only available in German.
Brand Guidelines
Alles was du brauchst um Impulio konsistent und wiedererkennbar darzustellen. Von Logo und Farben bis hin zu Typografie und Tone of Voice.
Brand Story
Impulio gibt Social-Media-Creatorn die Werkzeuge, die sie brauchen, um ihren Content strategisch zu planen und konsistent zu veröffentlichen. Intelligente Funktionen arbeiten unsichtbar im Hintergrund, damit du dich auf das konzentrieren kannst, was zählt: großartigen Content.
Creator-First
Jede Entscheidung beginnt mit der Frage: Macht das den Alltag von Creatorn einfacher?
Invisible Intelligence
KI arbeitet im Hintergrund. Keine Sparkles, keine Scores, keine "AI-generierten" Labels. Einfach bessere Ergebnisse.
Dark-First Design
Dunkle Oberflächen schonen die Augen und lassen Content leuchten. Jedes Element wird zuerst für den Dark Mode entworfen.
Privacy by Default
DSGVO-konform, gehostet in Deutschland. Deine Daten gehören dir.
Brand Personality
Impulio spricht wie ein Freund, der sich mit Social Media auskennt. Direkt, kompetent und auf Augenhöhe. Nie belehrend, nie corporate. Immer Du, nie Sie.
Logo
Das Impulio-Logo besteht aus einem stilisierten Blitz mit Energy Dot. Es steht für Kreativität, Energie und den Impuls, etwas zu veröffentlichen.
Schutzzone
Halte mindestens die Höhe des Energy Dots als Abstand zu anderen Elementen.
Mindestgrößen
Um die Lesbarkeit des Logos zu gewährleisten, sollte es nicht kleiner als 24px dargestellt werden.
Do's & Don'ts
Do
- Auf dunklem Hintergrund verwenden
- Seitenverhältnis beibehalten
- Genügend Abstand einhalten
Don't
- Logo verzerren oder strecken
- Gradient-Farben ändern
- Auf unruhigem Hintergrund platzieren
- Schatten oder Effekte hinzufügen
Farbpalette
Unsere Markenfarbe ist Impulio Green (#005F54) — ein tiefes, professionelles Grün mit WCAG AAA-Kontrast (7.60:1) gegenüber Weiß. Cyan und Violet bleiben dem AI-Branding (ImpulseIcon-Gradient) vorbehalten.
Markenfarben
Impulio Green
rgb(0, 95, 84)
Primärfarbe, CTA-Buttons, Logo-"io"-Text, Icon-Hintergründe, dekorative Elemente (WCAG AAA auf hellem Hintergrund, 7.60:1)
Impulio Cyan
rgb(0, 229, 204)
AI-Features, ImpulseIcon-Gradient, Glow-Effekte (Cyan→Violet AI-Brand)
Cyan Bright
rgb(0, 255, 224)
Hover-Zustände auf AI-Cyan-Elementen
Cyan Muted
rgb(0, 184, 163)
Dezente AI-Akzente im App-Bereich
Impulio Violet
rgb(139, 92, 246)
Akzentfarbe, Gradient-Endpunkte (AI-Brand)
Violet Bright
rgb(167, 139, 250)
Hover-Zustände für Violet-Elemente
Violet Muted
rgb(124, 58, 237)
Sekundäre Violet-Akzente
Hintergründe
BG Primary
rgb(10, 10, 15)
Haupthintergrund
BG Secondary
rgb(18, 18, 26)
Karten, erhöhte Flächen
BG Tertiary
rgb(26, 26, 36)
Hover-Zustände, Input-Hintergründe
Semantisch
Success
rgb(16, 185, 129)
Erfolgsmeldungen
Warning
rgb(245, 158, 11)
Warnungen
Error
rgb(239, 68, 68)
Fehlermeldungen
Typografie
Unsere Typografie verbindet Klarheit mit Persönlichkeit. Drei Schriftfamilien decken alle Einsatzbereiche ab.
Schriftfamilien
Aa Bb Cc Dd Ee Ff Gg
Plus Jakarta Sans
font-display
Headlines, Brand-Elemente
Aa Bb Cc Dd Ee Ff Gg
Inter
font-sans
Fließtext, UI-Elemente
Aa Bb Cc 0123456789
JetBrains Mono
font-mono
Code-Snippets, technische Werte
Type Scale
Hero
text-hero
2.5rem - 4.5rem / LH 1.1
Landing-Page Hero Headlines
Impulio Brand Guidelines
H1
text-h1
2rem - 3rem / LH 1.2
Seitentitel
Impulio Brand Guidelines
H2
text-h2
1.5rem - 2.25rem / LH 1.3
Sektionsüberschriften
Impulio Brand Guidelines
H3
text-h3
1.25rem - 1.5rem / LH 1.4
Unterabschnitte
Impulio Brand Guidelines
Body
text-base
1rem / LH 1.6
Fließtext, Beschreibungen
Impulio Brand Guidelines
Small
text-sm
0.875rem / LH 1.5
Beschriftungen, Labels
Impulio Brand Guidelines
Schriftschnitte
Content-Planung für Social Media Creator
Content-Planung für Social Media Creator
Content-Planung für Social Media Creator
Content-Planung für Social Media Creator
Visueller Stil
Unser visueller Stil basiert auf einem dunklen Farbschema, subtilen Glow-Effekten und klaren Gradient-Akzenten.
Dark-First Design
Impulio nutzt ein dunkles Farbschema als Basis. Alle Komponenten werden zuerst für den Dark Mode entworfen, um Augen zu schonen und Content zum Leuchten zu bringen.
Glow Effects
Gradient
Brand Gradient
linear-gradient(135deg, #00E5CC, #8B5CF6)
Text Gradient
Impulio
.text-gradient-impulio
Elevation 2
Karte mit mittlerer Elevation
.elevation-2
Iconography
Primär: Lucide React Icons
Für KI-Features: ImpulseIcon
Verwende NIEMALS Sparkle- oder Zauberstab-Icons für KI-Funktionen.
Motion & Animation
Transition-Utilities: .transition-theme, .transition-theme-fast, .transition-theme-slow
Barrierefreiheit
Alle Textfarben müssen WCAG 2.1 AA erfüllen: 4.5:1 für Fließtext, 3:1 für große Schrift (≥18pt oder ≥14pt fett).
Cyan Text auf hellem Hintergrund (#F7F7F5) — 4.89:1
Nur für Buttons, Icons, dekorative Elemente — nicht als Textfarbe auf Hell
CSS-Variable: --marketing-accent-text: #005F54 für barrierefreie Textfarbe, --marketing-accent: #00E5CC für Hintergründe und Dekoration.
Component Showcase
Buttons
Tone of Voice
Unsere Sprache ist direkt, freundschaftlich und kompetent. Wir vermeiden typische KI-Floskeln und sprechen auf Augenhöhe.
Markenstimme
Direkt
Wir kommen zum Punkt. Keine Floskeln, keine Umwege. Jeder Satz hat einen Grund.
Freundschaftlich
Wie ein Freund der sich mit Social Media auskennt. Du-Ansprache, lockerer Ton, auf Augenhöhe.
Kompetent
Wir wissen wovon wir reden, ohne belehrend zu wirken. Fakten statt Meinungen.
Sprachregeln
- Immer Du-Ansprache (nie Sie)
- Deutsch als Hauptsprache
- Kurze Sätze bevorzugen (5.–7. Klasse Leseniveau)
- Aktiv statt Passiv
- Keine Fachbegriffe ohne Erklärung
- CTA: "testen" statt "starten" (+104% Conversion)
- Satzlängen bewusst variieren (Burstiness)
- Claims rechtlich prüfbar halten (deutsches Werberecht/UWG)
Verbotene Phrasen
- "Darüber hinaus"
- "Zusammenfassend"
- "Basierend auf deinen Präferenzen..."
- "Die semantische Analyse zeigt..."
- "Aufgrund der thematischen Übereinstimmung..."
- "Revolutioniere deinen Content"
- "Cutting-edge" / "State-of-the-art"
- Prozentangaben oder Scores im Text
- Uniforme Satzlängen (variierende Längen verwenden)
- Superlative mit Artikel ("die beste App") ohne Beweis (UWG)
Gut vs. Schlecht
Schlecht
Gut
Passt zu deiner “Home Office” Säule