Registrieren Registrieren
Blue To Yellow

Blue To Yellow

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

Zurück zur Bibliothek

Blue To Yellow

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

Bearbeiten
Gedeckt 8 Farben Kühl Dunkel Komplementär monoramp blue yellow colorramp
Likes 23
Farben 8

CSS-Variablen

:root {
  --c-muted-1: #1C325E;
  --c-muted-2: #404F59;
  --c-muted-3: #616952;
  --c-muted-4: #787B4A;
  --c-muted-5: #105060;
  --c-muted-6: #386A50;
  --c-muted-7: #608441;
  --c-muted-8: #889D31;
}

Über diese Palette

Diese gedeckte Palette mit 8 Farben reicht vom hellsten Ton Vigorous Wasabi (#889D31) bis zum dunkelsten Ton Ending Navy Blue (#1C325E). Sie vereint Ending Navy Blue, Presidential, Rosemary Sprig, Tara’s Drapes, Teal Dark Blue, Jungle Book Green, Shepherd’s Green und Vigorous Wasabi in einem Set, das du direkt in deine Benutzeroberfläche übernehmen kannst. Keines der 28 Farbpaare der Palette erreicht die WCAG-AA-Kontrastschwelle (4,5:1) – kombiniere diese Farben für Fließtext daher mit Schwarz oder Weiß.

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

Farben im Detail

Ending Navy Blue #1C325E
RGB
rgb(28, 50, 94)
HSL
hsl(220, 54%, 24%)
Luminanz
0,033
Presidential #404F59
RGB
rgb(64, 79, 89)
HSL
hsl(204, 16%, 30%)
Luminanz
0,074
Rosemary Sprig #616952
RGB
rgb(97, 105, 82)
HSL
hsl(81, 12%, 37%)
Luminanz
0,133
Tara’s Drapes #787B4A
RGB
rgb(120, 123, 74)
HSL
hsl(64, 25%, 39%)
Luminanz
0,187
Teal Dark Blue #105060
RGB
rgb(16, 80, 96)
HSL
hsl(192, 71%, 22%)
Luminanz
0,067
Jungle Book Green #386A50
RGB
rgb(56, 106, 80)
HSL
hsl(149, 31%, 32%)
Luminanz
0,117
Shepherd’s Green #608441
RGB
rgb(96, 132, 65)
HSL
hsl(92, 34%, 39%)
Luminanz
0,194
Vigorous Wasabi #889D31
RGB
rgb(136, 157, 49)
HSL
hsl(72, 52%, 40%)
Luminanz
0,296

Kontrast & Barrierefreiheit

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

Aa #1C325E auf #889D31 4,15:1 AA (großer Text)
Aa #105060 auf #889D31 2,96:1 Nicht bestanden
Aa #1C325E auf #608441 2,92:1 Nicht bestanden
Aa #1C325E auf #787B4A 2,84:1 Nicht bestanden
Aa #404F59 auf #889D31 2,79:1 Nicht bestanden
Aa #1C325E auf #616952 2,19:1 Nicht bestanden
Aa #105060 auf #608441 2,08:1 Nicht bestanden
Aa #386A50 auf #889D31 2,07:1 Nicht bestanden
Aa #787B4A auf #105060 2,02:1 Nicht bestanden
Aa #1C325E auf #386A50 2,01:1 Nicht bestanden
Aa #404F59 auf #608441 1,96:1 Nicht bestanden
Aa #404F59 auf #787B4A 1,91:1 Nicht bestanden
Aa #616952 auf #889D31 1,89:1 Nicht bestanden
Aa #616952 auf #105060 1,56:1 Nicht bestanden
Aa #1C325E auf #404F59 1,49:1 Nicht bestanden
Aa #404F59 auf #616952 1,47:1 Nicht bestanden
Aa #787B4A auf #889D31 1,46:1 Nicht bestanden
Aa #386A50 auf #608441 1,46:1 Nicht bestanden
Aa #105060 auf #386A50 1,43:1 Nicht bestanden
Aa #608441 auf #889D31 1,42:1 Nicht bestanden
Aa #787B4A auf #386A50 1,41:1 Nicht bestanden
Aa #1C325E auf #105060 1,40:1 Nicht bestanden
Aa #404F59 auf #386A50 1,35:1 Nicht bestanden
Aa #616952 auf #608441 1,34:1 Nicht bestanden
Aa #616952 auf #787B4A 1,30:1 Nicht bestanden
Aa #616952 auf #386A50 1,09:1 Nicht bestanden
Aa #404F59 auf #105060 1,06:1 Nicht bestanden
Aa #787B4A auf #608441 1,03:1 Nicht bestanden

Ähnliche Paletten

#212121 #323232 #0D7377 #14FFEC
4 Farben
#0A2647 #144272 #205295 #2C74B3
4 Farben
#040D12 #183D3D #5C8374 #93B1A6
4 Farben
#142850 #27496D #0C7B93 #00A8CC
4 Farben
#635985 #443C68 #393053 #18122B
4 Farben
#000000 #150050 #3F0071 #610094
4 Farben
#151515 #301B3F #3C415C #B4A5A5
4 Farben
#041C32 #04293A #064663 #ECB365
4 Farben