Citrink

Palette mit 8 Farben · Kühl · Gemischt · Harmonie: Komplementär

Zurück zur Bibliothek

Citrink

Palette mit 8 Farben · Temperatur: Kühl · Ton: Gemischt · Harmonie: Komplementär

Bearbeiten

Gedeckt 8 Farben Kühl Gemischt Komplementär green psychedelic acid 8colors

Likes 1.116

Farben 8

CSS-Variablen

:root {
  --c-muted-1: #FFFFFF;
  --c-muted-2: #FCF660;
  --c-muted-3: #B2D942;
  --c-muted-4: #52C33F;
  --c-muted-5: #166E7A;
  --c-muted-6: #254D70;
  --c-muted-7: #252446;
  --c-muted-8: #201533;
}

Über diese Palette

Diese gedeckte Palette mit 8 Farben reicht vom hellsten Ton White (#FFFFFF) bis zum dunkelsten Ton Blacklist (#201533). Sie vereint White, Icterine, Burst of Lime, Skirret Green, Teal Fury, Blue Tang, Black Market und Blacklist in einem Set, das du direkt in deine Benutzeroberfläche übernehmen kannst. Farbpaare in der Palette: 28. Davon erreichen 13 die WCAG-AA-Kontrastschwelle (4,5:1) für Fließtext – am stärksten ist #FFFFFF auf #201533 mit 17,26:1.

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

Farben im Detail

White #FFFFFF

RGB: rgb(255, 255, 255)
HSL: hsl(0, 0%, 100%)
Luminanz: 1,000

Icterine #FCF660

RGB: rgb(252, 246, 96)
HSL: hsl(58, 96%, 68%)
Luminanz: 0,875

Burst of Lime #B2D942

RGB: rgb(178, 217, 66)
HSL: hsl(75, 67%, 55%)
Luminanz: 0,595

Skirret Green #52C33F

RGB: rgb(82, 195, 63)
HSL: hsl(111, 52%, 51%)
Luminanz: 0,412

Teal Fury #166E7A

RGB: rgb(22, 110, 122)
HSL: hsl(187, 69%, 28%)
Luminanz: 0,127

Blue Tang #254D70

RGB: rgb(37, 77, 112)
HSL: hsl(208, 50%, 29%)
Luminanz: 0,069

Black Market #252446

RGB: rgb(37, 36, 70)
HSL: hsl(242, 32%, 21%)
Luminanz: 0,021

Blacklist #201533

RGB: rgb(32, 21, 51)
HSL: hsl(262, 42%, 14%)
Luminanz: 0,011

Kontrast & Barrierefreiheit

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

Aa #FFFFFF auf #201533 17,26:1 AAA

Aa #FCF660 auf #201533 15,20:1 AAA

Aa #FFFFFF auf #252446 14,79:1 AAA

Aa #FCF660 auf #252446 13,03:1 AAA

Aa #B2D942 auf #201533 10,60:1 AAA

Aa #B2D942 auf #252446 9,09:1 AAA

Aa #FFFFFF auf #254D70 8,85:1 AAA

Aa #FCF660 auf #254D70 7,79:1 AAA

Aa #52C33F auf #201533 7,59:1 AAA

Aa #52C33F auf #252446 6,51:1 AA

Aa #FFFFFF auf #166E7A 5,92:1 AA

Aa #B2D942 auf #254D70 5,43:1 AA

Aa #FCF660 auf #166E7A 5,22:1 AA

Aa #52C33F auf #254D70 3,89:1 AA (großer Text)

Aa #B2D942 auf #166E7A 3,64:1 AA (großer Text)

Aa #166E7A auf #201533 2,91:1 Nicht bestanden

Aa #52C33F auf #166E7A 2,61:1 Nicht bestanden

Aa #166E7A auf #252446 2,50:1 Nicht bestanden

Aa #FFFFFF auf #52C33F 2,27:1 Nicht bestanden

Aa #FCF660 auf #52C33F 2,00:1 Nicht bestanden

Aa #254D70 auf #201533 1,95:1 Nicht bestanden

Aa #254D70 auf #252446 1,67:1 Nicht bestanden

Aa #FFFFFF auf #B2D942 1,63:1 Nicht bestanden

Aa #166E7A auf #254D70 1,49:1 Nicht bestanden

Aa #FCF660 auf #B2D942 1,43:1 Nicht bestanden

Aa #B2D942 auf #52C33F 1,40:1 Nicht bestanden

Aa #252446 auf #201533 1,17:1 Nicht bestanden

Aa #FFFFFF auf #FCF660 1,14:1 Nicht bestanden

Citrink

Citrink

CSS-Variablen

Über diese Palette

Farben im Detail

Kontrast & Barrierefreiheit

Ähnliche Paletten

Schriftarten

Icons & SVG

Farben

Bilder

CSS-Tools

Entwicklung

Dokumentation

Unternehmen