Eine Markenfarbe rein. Ein funktionierendes Farbsystem raus.
GetColors macht aus einer Markenfarbe helle und dunkle UI-Rollen, prüft jede Kombination auf Kontrast und exportiert sie für Tailwind v4, shadcn/ui, reines CSS oder Design Tokens. Deine KI-Agenten nutzen dieselben Tools über MCP.
So funktioniert GetColors
- Starte mit einer Markenfarbe. Gib einen Hex-Code ein, wähle sie mit dem Farbwähler aus oder übernimm sie aus einem Bild oder einer bestehenden Website.
- GetColors baut daraus in OKLCH ein helles und ein dunkles Theme mit Rollen wie Canvas, Surface, Ink, Primary und Accent.
- Jedes Rollenpaar wird in beiden Themes auf WCAG-2-Kontrast geprüft, und das Studio zeigt dir, welche Paare noch Arbeit brauchen.
- Exportiere das System als CSS-Variablen, light-dark(), Tailwind v4, shadcn/ui oder Design Tokens, oder lass einen KI-Agenten dieselben Tools über MCP nutzen.
Das kannst du mit GetColors machen
Ein Farbsystem aufbauen
Mach aus einer Markenfarbe helle und dunkle UI-Rollen in OKLCH, mit Live-Vorschau beider Themes.
Farbpaletten generieren
Sperre die Farben, die dir gefallen, und mische den Rest neu, probiere Harmonien wie analog, triadisch und komplementär aus und sieh dir an, wie eine Palette bei Farbenblindheit wirkt.
Kontrast prüfen
Teste jede Kombination aus Text- und Hintergrundfarbe nach WCAG 2.1 und APCA und korrigiere eine durchgefallene Textfarbe automatisch.
Bestehende Farben prüfen
Füge CSS, ein Tailwind-Theme oder shadcn-Globals ein und finde Kontrastfehler, fast identische Farben, fest codierte Werte und fehlende Dark-Rollen. Das Audit läuft in deinem Browser.
Paletten, Verläufe und Farbnamen entdecken
Stöbere in kuratierten Farbpaletten und CSS-Verläufen nach Stimmung, Theme oder Farbton und schlage benannte Farben mit ihren HEX-, RGB- und OKLCH-Werten nach.
Nutze es da, wo du arbeitest
Eine Chrome-Erweiterung, ein Figma-Plugin, eine REST-API, ein MCP-Server für KI-Agenten und eine shadcn/ui-Registry laufen alle mit derselben Engine wie die Website.
Häufige Fragen
Was ist GetColors?
GetColors ist eine Sammlung von Farbtools für Designer und Entwickler: ein Farbpaletten-Generator, ein Color System Studio, ein Kontrastprüfer, ein Tailwind-Skalen-Generator, ein Farbwähler für Bilder und mehr. Für die Farbtools brauchst du kein Konto.
Ist GetColors kostenlos?
Ja. Alle zentralen Farbtools und Exporte sind kostenlos nutzbar. GetColors Pro ist ein separater Tarif mit einer größeren Cloud-Palettenbibliothek, mit der auch KI-Agenten arbeiten können.
Was ist ein Farbsystem?
Ein Farbsystem gibt jeder Farbe eine Aufgabe. Statt einer losen Palette definiert es Rollen wie Hintergrund, Text, Hauptaktion und Rahmen, jeweils in einem hellen und einem dunklen Theme. So lässt sich jede Kombination auf Kontrast prüfen und im Code einheitlich wiederverwenden.
Was ist OKLCH und warum nutzt GetColors es?
OKLCH beschreibt eine Farbe über Helligkeit, Chroma und Farbton, in einem Farbraum, in dem gleiche Zahlenschritte auch gleich große visuelle Schritte ergeben. Dadurch bleiben Skalen und Themes gleichmäßiger, und Tailwind v4 nutzt OKLCH für seine eigene Palette.
Können KI-Agenten GetColors nutzen?
Ja. GetColors betreibt einen MCP-Server, über den Claude, Cursor und andere MCP-Clients Paletten generieren, Kontrast prüfen, Tailwind-Skalen und Farbsysteme bauen und die Farben einer Codebasis prüfen können. Die kostenlosen Tools brauchen kein Token.