Farbpaletten-Generator
Generiere harmonische Farbpaletten aus einer Basisfarbe mit komplementären, analogen, triadischen und monochromatischen Regeln.
Was diese Seite abdeckt
Diese Seite erklärt den Ablauf und verlinkt direkt auf den passenden Bereich des Chromoforge-Haupttools.
- Generiere Paletten aus einer Basisfarbe.
- Prüfe Kontrast vor dem Veröffentlichen von UI-Text.
- Exportiere CSS, Tailwind, SCSS, JSON, SVG und PNG.
- Läuft lokal im Browser.
Wie es funktioniert
Der Farbpaletten-Generator von Chromoforge nutzt das HSL-Farbrad, um präzise Harmonien aus einer einzigen Ausgangsfarbe zu berechnen. Gib deine Farbe als Hexadezimalwert, HSL oder RGB ein und wähle eine Harmonieregel.
Jede Regel erzeugt eine andere Palette basierend auf festen Winkeln auf dem Farbrad:
- Komplementär: Zwei gegenüberliegende Farben bei 180 Grad. Sehr kontrastreich, ideal für Call-to-Actions und Hervorhebungen.
- Analog: Drei benachbarte Farben (±30 Grad). Weich und harmonisch, perfekt für moderne Interfaces und Illustrationen.
- Triadisch: Drei gleichmäßig verteilte Farben bei 120 Grad. Ausgewogen und lebendig, verwendet in energiegeladenen Corporate-Identitäten.
- Monochromatisch: Helligkeits- und Sättigungsvarianten derselben Farbe. Elegant und konsistent, ideal für Design Systems.
- Split-komplementär: Eine Hauptfarbe und zwei Farben neben ihrer Komplementärfarbe. Weniger abrupt als reines Komplementär.
Nach der Generierung zeigt jede Farbe ihren Hexadezimalcode sowie RGB- und HSL-Werte. Du kannst jeden Code einzeln kopieren oder alles als CSS, JSON, Tailwind oder SCSS aus dem Haupttool exportieren.
Praktische Beispiele
Situationen, in denen ein Paletten-Generator deinen Workflow beschleunigt:
- Markenidentität: Ausgehend vom Blau des Kundenlogos (#1E40AF) generierst du eine triadische Palette für konsistente Sekundär- und Tertiärfarben.
- Landing Page: Eine analoge Palette liefert abwechselnde Sektionshintergründe ohne aggressive visuelle Brüche.
- Token-System: Die monochromatische Palette liefert direkt die Nuancen 100-900 für deine Primärfarben-Variablen.
- Umgestaltung eines bestehenden Themes: Gib die Hauptfarbe des Themes ein und erhalte passende Akzentvorschläge.
FAQ — Farbpaletten
Wie viele Farben enthält eine generierte Palette?
Das hängt von der gewählten Regel ab. Komplementäre und monochromatische Harmonien können je nach gewünschter Nuancenanzahl 2 bis 10 Farbtöne erzeugen. Triadische und analoge Regeln liefern in der Regel 3 bis 6 Basisfarben. Die Nuancenanzahl lässt sich im Chromoforge-Haupttool anpassen.
Ist die generierte Palette garantiert barrièrefrei?
Nein, die Palettengenerierung basiert auf Farbharmonie, nicht auf WCAG-Kontrast. Verwende nach der Generierung den WCAG-Kontrastprüfer oder das Barrierefreie-Palette-Tool, um die Text/Hintergrund-Kombinationen zu validieren.
Kann ich Farben außerhalb des sRGB-Farbraums verwenden?
Chromoforge arbeitet im sRGB-Farbraum, dem Webstandard. P3- oder ProPhoto-RGB-Farben werden nicht direkt unterstützt, aber oklch()-Werte können manuell in sRGB-Hexadezimal umgerechnet werden, bevor du sie eingibst.