Farbschaltblatt-Generator

Farbschaltblatt-Generator

Fügen Sie eine Liste von Farben ein und sehen Sie sie sofort als druckbare Farbpalette mit Hex-Bezeichnungen vor. Verwenden Sie beliebige CSS-Farbeingaben – kurze und lange Hex-Farben, rgb(), rgba(), hsl(), hsla(), oder benannte Farben wie tomato – und laden Sie die Tabelle als hochauflösendes PNG- oder skalierbares SVG-Datei für die Übertragung, Druck oder Dokumentation eines Designsystems herunter.

Nutzung

1. Geben Sie eine Farbe pro Zeile in das Farben Textfeld ein, oder klicken Sie Probieren Sie ein Beispiel aus um eine Startpalette zu laden.
2. Passen Sie Spalten, Abmessung der Farbpalette, Abstandund Paddings der Tabelle um die Layout-Option, die Sie benötigen, zu erreichen.
3. Wählen Sie eine Hintergrundfarbe für die Tabelle und bestimmen Sie, ob Hex-Bezeichnungen oder übereinstimmende CSS-Farbnamen auf jeder Farbpalette angezeigt werden sollen.
4. Wählen Sie die Farbe der Beschriftungen – Automatisch verwendet Kontrast gegenüber jeder Farbpalette, oder erzwingen Immer dunkel oder Immer hell.
5. Klicken Sie auf PNG herunterladen für eine 2x-Gitter-Export, oder SVG herunterladen für eine Vektor-Datei, die in Figma, Illustrator oder jedem Browser geöffnet werden kann.

Funktionen

• Mehrformat-Eingabe – akzeptiert Hex (#abc, #aabbcc, #aabbccdd), rgb(), rgba(), hsl(), hsla(), und benannte CSS-Farben in derselben Liste.
• Live-SVG-Vorschau – die Tabelle wird bei jeder Eingabe neu erstellt, sodass Layout-Änderungen sofort wirksam werden.
• Konfigurierbare Gitter – steuern Sie die Anzahl der Spalten, die Breite und Höhe der Farbpalette, den Abstand, das Paddings und die Eckenrundung.
• Intelligente Beschriftungen – zeigen Hex-Werte an, erkennen automatisch übereinstimmende CSS-Farbnamen und wählen Kontrast- oder feste Beschriftungsfarben.
• Transparente Farben – Farbpalette mit Alpha-Transparenz werden über ein Kachelmuster gerendert, sodass die Transparenz in den Exporten visuell sichtbar ist.
• Zwei Exportformate – hochauflösendes PNG über Canvas, plus eine kopierbare SVG-Datei für den Einsatz in Vektor-Tools.
• Vollständig clientseitig – Farben bleiben im Browser, sodass sie sicher für noch nicht veröffentlichte Markenpaletten sind.