Crimson Gold

Palette mit 8 Farben · Warm · Gemischt · Harmonie: Analog

Zurück zur Bibliothek

Crimson Gold

Palette mit 8 Farben · Temperatur: Warm · Ton: Gemischt · Harmonie: Analog

Bearbeiten

Lebendig 8 Farben Warm Gemischt Analog red warm yellow crimson

Likes 76

Farben 8

CSS-Variablen

:root {
  --c-vibrant-1: #3A0000;
  --c-vibrant-2: #590000;
  --c-vibrant-3: #7C0300;
  --c-vibrant-4: #C02B18;
  --c-vibrant-5: #E04217;
  --c-vibrant-6: #F26D1F;
  --c-vibrant-7: #FF933A;
  --c-vibrant-8: #FFCE59;
}

Über diese Palette

Diese lebendige Palette mit 8 Farben reicht vom hellsten Ton Casandora Yellow (#FFCE59) bis zum dunkelsten Ton Old Brown Crayon (#3A0000). Sie vereint Old Brown Crayon, Soooo Bloody, Maroon, Red Death, Tail Lights, Apocalyptic Orange, Joyful Orange und Casandora Yellow in einem Set, das du direkt in deine Benutzeroberfläche übernehmen kannst. Farbpaare in der Palette: 28. Davon erreichen 8 die WCAG-AA-Kontrastschwelle (4,5:1) für Fließtext – am stärksten ist #3A0000 auf #FFCE59 mit 12,06:1.

Eine vielseitige Palette für Marketingseiten, Hero-Blöcke von Produkten, Illustrationen und Akzentzustände in der UI.

Farben im Detail

Old Brown Crayon #3A0000

RGB: rgb(58, 0, 0)
HSL: hsl(0, 100%, 11%)
Luminanz: 0,009

Soooo Bloody #590000

RGB: rgb(89, 0, 0)
HSL: hsl(0, 100%, 17%)
Luminanz: 0,021

Maroon #7C0300

RGB: rgb(124, 3, 0)
HSL: hsl(1, 100%, 24%)
Luminanz: 0,044

Red Death #C02B18

RGB: rgb(192, 43, 24)
HSL: hsl(7, 78%, 42%)
Luminanz: 0,130

Tail Lights #E04217

RGB: rgb(224, 66, 23)
HSL: hsl(13, 81%, 48%)
Luminanz: 0,198

Apocalyptic Orange #F26D1F

RGB: rgb(242, 109, 31)
HSL: hsl(22, 89%, 54%)
Luminanz: 0,299

Joyful Orange #FF933A

RGB: rgb(255, 147, 58)
HSL: hsl(27, 100%, 61%)
Luminanz: 0,424

Casandora Yellow #FFCE59

RGB: rgb(255, 206, 89)
HSL: hsl(42, 100%, 67%)
Luminanz: 0,661

Kontrast & Barrierefreiheit

8 von 28 Farbpaaren erreichen die WCAG-AA-Kontrastschwelle (4,5:1) für Fließtext.

Aa #3A0000 auf #FFCE59 12,06:1 AAA

Aa #590000 auf #FFCE59 9,98:1 AAA

Aa #3A0000 auf #FF933A 8,04:1 AAA

Aa #7C0300 auf #FFCE59 7,61:1 AAA

Aa #590000 auf #FF933A 6,66:1 AA

Aa #3A0000 auf #F26D1F 5,92:1 AA

Aa #7C0300 auf #FF933A 5,07:1 AA

Aa #590000 auf #F26D1F 4,90:1 AA

Aa #3A0000 auf #E04217 4,20:1 AA (großer Text)

Aa #C02B18 auf #FFCE59 3,95:1 AA (großer Text)

Aa #7C0300 auf #F26D1F 3,73:1 AA (großer Text)

Aa #590000 auf #E04217 3,48:1 AA (großer Text)

Aa #3A0000 auf #C02B18 3,05:1 AA (großer Text)

Aa #E04217 auf #FFCE59 2,87:1 Nicht bestanden

Aa #7C0300 auf #E04217 2,65:1 Nicht bestanden

Aa #C02B18 auf #FF933A 2,64:1 Nicht bestanden

Aa #590000 auf #C02B18 2,53:1 Nicht bestanden

Aa #F26D1F auf #FFCE59 2,04:1 Nicht bestanden

Aa #C02B18 auf #F26D1F 1,94:1 Nicht bestanden

Aa #7C0300 auf #C02B18 1,93:1 Nicht bestanden

Aa #E04217 auf #FF933A 1,91:1 Nicht bestanden

Aa #3A0000 auf #7C0300 1,58:1 Nicht bestanden

Aa #FF933A auf #FFCE59 1,50:1 Nicht bestanden

Aa #E04217 auf #F26D1F 1,41:1 Nicht bestanden

Aa #C02B18 auf #E04217 1,38:1 Nicht bestanden

Aa #F26D1F auf #FF933A 1,36:1 Nicht bestanden

Aa #590000 auf #7C0300 1,31:1 Nicht bestanden

Aa #3A0000 auf #590000 1,21:1 Nicht bestanden

Crimson Gold

Crimson Gold

CSS-Variablen

Über diese Palette

Farben im Detail

Kontrast & Barrierefreiheit

Ähnliche Paletten

Schriftarten

Icons & SVG

Farben

Bilder

CSS-Tools

Entwicklung

Dokumentation

Unternehmen