Nouplo

Farbpalette erstellen

Leertaste für eine neue Palette – Farben, die Ihnen gefallen, einfach sperren.

oder Leertaste drücken
  1. rgb(237, 221, 187)hsl(41, 58%, 83%)
    Weiße Schrift
    1.34:1AAAAA
    Schwarze Schrift
    15.66:1AAAAA
  2. rgb(143, 173, 255)hsl(224, 100%, 78%)
    Weiße Schrift
    2.19:1AAAAA
    Schwarze Schrift
    9.59:1AAAAA
  3. rgb(92, 123, 230)hsl(227, 73%, 63%)
    Weiße Schrift
    3.87:1AAAAA
    Schwarze Schrift
    5.43:1AAAAA
  4. rgb(59, 91, 219)hsl(228, 69%, 55%)
    Weiße Schrift
    5.67:1AAAAA
    Schwarze Schrift
    3.71:1AAAAA
  5. rgb(60, 52, 31)hsl(43, 32%, 18%)
    Weiße Schrift
    12.33:1AAAAA
    Schwarze Schrift
    1.70:1AAAAA

Nichts verlässt Ihr Gerät

Dieses Tool läuft vollständig in Ihrem Browser. Was Sie hier eingeben, spielen oder aufnehmen, bleibt auf Ihrem Gerät: Nichts wird hochgeladen oder auf einem Server gespeichert.

So funktioniert es

  1. Auf „Neue Palette“ tippen oder die Leertaste drücken – oder eine Grundfarbe eingeben und ein Farbschema wählen, etwa komplementär oder triadisch.
  2. Farben, die Ihnen gefallen, sperren: Die nächste Palette behält sie und baut den Rest darum herum. Ein Klick auf eine Farbe kopiert ihren Hex-Code.
  3. Die Kontrastangaben prüfen, in der Vorschau ansehen, wie Menschen mit Farbsehschwäche die Palette sehen, und CSS-Variablen kopieren oder PNG bzw. SVG herunterladen.

Häufige Fragen

Welche Farbschemata gibt es?
Regeln aus dem Farbkreis: analog nimmt Nachbarfarben (±30°), komplementär den gegenüberliegenden Farbton, geteilt komplementär die beiden neben dem Gegenüber, triadisch drei Farbtöne im Abstand von 120°, Quadrat vier im Abstand von 90°, monochrom einen Farbton in hellen und dunklen Stufen, pastell sanfte, helle Farben rund um den Kreis.
Warum wirken die Farben so ausgewogen?
Sie werden in OKLCH berechnet, einem Farbraum, der der wahrgenommenen Helligkeit entspricht – so wirken die Helligkeitsstufen gleichmäßig. Farben, die ein Bildschirm nicht darstellen kann, werden so weit abgeschwächt, bis es passt.
Was bedeuten die Kontrastangaben?
Das WCAG-Kontrastverhältnis von weißer und schwarzer Schrift auf jeder Farbe: AA verlangt 4,5 für normalen Text, AAA 7. Die Beschriftung steht jeweils in der besser lesbaren Farbe.
Kann ich eine Palette aus einem Foto erstellen?
Ja – dafür gibt es das Werkzeug „Farbpalette aus einem Bild“, das die Hauptfarben eines Fotos herausliest. Dieses hier erstellt neue Farbkombinationen.
Wird etwas hochgeladen?
Nein. Die Paletten entstehen in Ihrem Browser; ein geteilter Link enthält nur die Farben selbst.

Verwandte Tools