Farbton-Generator

Generiert Aufhellungs- und Abdunklungsskalen mit exportierbaren CSS-Variablen.

Der Farbton-Generator erstellt Aufhellungs- und Abdunklungsskalen aus einer Basisfarbe, zeigt sie als Verlaufsbalken und exportiert gebrauchsfertige CSS-Eigenschaften.

Farbe

Anzahl

Modus

Ausgabe

{
  "mode": "tint",
  "count": 5,
  "colors": [
    "#4c7fef",
    "#739bf2",
    "#9ab7f6",
    "#c1d2f9",
    "#e8eefd"
  ],
  "cssVars": "--shade-1: #4c7fef;\n--shade-2: #739bf2;\n--shade-3: #9ab7f6;\n--shade-4: #c1d2f9;\n--shade-5: #e8eefd;"
}

So wird's genutzt

Wähle eine Basisfarbe.
Wähle die Anzahl der Schritte und ob Aufhellungen, Abdunklungen oder beides generiert werden.
Kopiere die Farben oder CSS-Variablen.