Workflow · Bild & Design
Design-Token-Pass
Hex, OKLCH, Radius, Spacing und Schatten als Tokens vorbereiten.
01Farbe wandeln
02OKLCH notieren
03Radius skalieren
04Spacing setzen
Ablauf
Warum diese Werkzeugkette zusammengehört.
Hex, OKLCH, Radius, Spacing und Schatten als Tokens vorbereiten. Der Ablauf ist für wiederholbare Kleinarbeit gedacht: zuerst Eingabe säubern, dann Ergebnis prüfen, danach kopieren oder in den nächsten Schritt übernehmen.
Startpunkt
Beginne mit dem klarsten Rohmaterial: Text, Link, Zahl, Liste oder Datenausschnitt. Je sauberer die erste Eingabe, desto weniger Nacharbeit entsteht.
Werkzeuge
Hex zu RGB, OKLCH-Farbnotiz, Radius-Skala, Fluid-Spacing-Skala bilden die Kernstrecke. Sie bleiben lokal im Browser und verändern keine Datei auf deinem Gerät.
Abschluss
Prüfe das Ergebnis vor Veröffentlichung, Import oder Weitergabe. Toolwise liefert Orientierung und Arbeitskomfort, ersetzt aber keine fachliche Freigabe.
Farbe wandeln
Wandelt Hexfarben in RGB und HSL um.
Hex zu RGB öffnenOKLCH notieren
Leitet aus Hex eine praktische OKLCH-Näherung und CSS-Zeile ab.
OKLCH-Farbnotiz öffnenRadius skalieren
Erzeugt konsistente Border-Radius-Stufen.
Radius-Skala öffnenSpacing setzen
Erzeugt mehrere clamp-Abstände aus Min- und Maxwert.
Fluid-Spacing-Skala öffnenWandelt Hexfarben in RGB und HSL um.
WorkflowLeitet aus Hex eine praktische OKLCH-Näherung und CSS-Zeile ab.
WorkflowErzeugt konsistente Border-Radius-Stufen.
WorkflowErzeugt mehrere clamp-Abstände aus Min- und Maxwert.
WorkflowErzeugt eine einfache Schatten-CSS-Zeile.
Workflow