Globales Tool Hub
Aktuelle Sprache: German

CSS-Variablen-Generator

Erstelle eine Farbtoken-Liste, prüfe jede Variable in der Vorschau und kopiere fertige CSS-Custom-Properties.

So funktioniert's

  1. Gib ein Präfix wie brand, theme oder ui ein.
  2. Bearbeite jeden Variablennamen und wähle eine Farbe.
  3. Füge bei Bedarf weitere Zeilen hinzu.
  4. Kopiere das generierte CSS in dein Stylesheet.

Farbvorschau

--brand-primary

--brand-secondary

--brand-accent

Generierte CSS-Variablen

:root {
  --brand-primary: #4f46e5;
  --brand-secondary: #06b6d4;
  --brand-accent: #f59e0b;
}