Zum Inhalt springen
Musterli

Dunkel

Farbpalette Kaminfeuer

Russ, Glut, Flamme und warmes Licht.

Im Palettengenerator öffnen

Farben sperren, mit der Leertaste neue Varianten würfeln und als Bild oder Code exportieren.

Farben

Ein Klick auf einen Wert kopiert ihn. Auf jedem Farbfeld steht der Wert in der Schriftfarbe, die darauf am besten lesbar ist.

  1. Farbe 1

    Text in Weiss, Kontrast 18.1:1

  2. Farbe 2

    Text in Weiss, Kontrast 12.9:1

  3. Farbe 3

    Text in Weiss, Kontrast 6.9:1

  4. Farbe 4

    Text in Schwarz, Kontrast 6.9:1

  5. Farbe 5

    Text in Schwarz, Kontrast 14.5:1

Code

Die Palette als CSS-Variablen für jedes Projekt und als Theme für Tailwind CSS v4.

CSS-Variablen

:root {
  --palette-1: #1e130f;
  --palette-2: #492921;
  --palette-3: #993c25;
  --palette-4: #dd7b2b;
  --palette-5: #f6d389;
}

Tailwind-Theme

@theme {
  --color-fireside-1: oklch(20% 0.02 40.8);
  --color-fireside-2: oklch(32% 0.05 34.8);
  --color-fireside-3: oklch(48.1% 0.13 35.1);
  --color-fireside-4: oklch(67.9% 0.15 54.9);
  --color-fireside-5: oklch(88% 0.1 85.1);
}

Verläufe aus dieser Palette

Dieselben Farben als Verlauf. Jede Karte öffnet den Editor mit diesen Farben.

Mit der Palette weiterarbeiten

Bearbeite die Palette oder baue aus ihrer kräftigsten Farbe eine ganze Skala.

So verwendest du die Palette

Lege die hellste Farbe als Hintergrund fest und nutze die dunkelste für Text. Die kräftigen Farben dazwischen eignen sich für Buttons, Links und Hervorhebungen. Prüfe bei Text immer den Kontrast; die Angaben auf den Farbfeldern zeigen, ob Schwarz oder Weiss besser lesbar ist.

Alle Farbpaletten
  • Samtvorhang

    Dunkles Weinrot, Samtrot und goldene Akzente wie im Theater.

  • Waldnacht

    Fünf Grüntöne vom dunklen Unterholz bis zum Mondlicht auf den Blättern.

  • Planetarium

    Nachthimmel, violetter Nebel, ein blauer Stern und Sternenlicht.

  • Nachtzug

    Tiefe Blautöne und das warme Licht eines Abteilfensters.

  • Ozeangraben

    Von fast Schwarz über Petrol bis zu hellem Aqua.

  • Beton

    Fünf neutrale Grautöne ohne Farbstich, die Basis für jedes Interface.