Registrieren Registrieren
Gas Station 12

Gas Station 12

Palette mit 12 Farben · Warm · Dunkel · Harmonie: Monochrom

Zurück zur Bibliothek

Gas Station 12

Palette mit 12 Farben · Temperatur: Warm · Ton: Dunkel · Harmonie: Monochrom

Bearbeiten
Gedeckt 12 Farben Warm Dunkel Monochrom green dark blue cyan
Likes 51
Farben 12

CSS-Variablen

:root {
  --c-muted-1: #BABE7C;
  --c-muted-2: #7D825A;
  --c-muted-3: #49513E;
  --c-muted-4: #373F34;
  --c-muted-5: #443F2D;
  --c-muted-6: #2F2D22;
  --c-muted-7: #1C1C17;
  --c-muted-8: #151614;
  --c-muted-9: #519585;
  --c-muted-10: #376862;
  --c-muted-11: #203F42;
  --c-muted-12: #19343A;
}

Über diese Palette

Diese gedeckte Palette mit 12 Farben reicht vom hellsten Ton Pine Glade (#BABE7C) bis zum dunkelsten Ton Matt Black (#151614). Sie vereint Pine Glade, Mosstone, Savannah Moss, Aged Pine, Woodrush, Karaka, Coco’s Black, Matt Black, Crisp Lettuce, Seiheki Green, Pine Hollow und Ore Bluish Black in einem Set, das du direkt in deine Benutzeroberfläche übernehmen kannst. Farbpaare in der Palette: 66. Davon erreichen 10 die WCAG-AA-Kontrastschwelle (4,5:1) für Fließtext – am stärksten ist #BABE7C auf #151614 mit 9,29:1.

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

Farben im Detail

Pine Glade #BABE7C
RGB
rgb(186, 190, 124)
HSL
hsl(64, 34%, 62%)
Luminanz
0,487
Mosstone #7D825A
RGB
rgb(125, 130, 90)
HSL
hsl(68, 18%, 43%)
Luminanz
0,211
Savannah Moss #49513E
RGB
rgb(73, 81, 62)
HSL
hsl(85, 13%, 28%)
Luminanz
0,077
Aged Pine #373F34
RGB
rgb(55, 63, 52)
HSL
hsl(104, 10%, 23%)
Luminanz
0,046
Woodrush #443F2D
RGB
rgb(68, 63, 45)
HSL
hsl(47, 20%, 22%)
Luminanz
0,050
Karaka #2F2D22
RGB
rgb(47, 45, 34)
HSL
hsl(51, 16%, 16%)
Luminanz
0,026
Coco’s Black #1C1C17
RGB
rgb(28, 28, 23)
HSL
hsl(60, 10%, 10%)
Luminanz
0,011
Matt Black #151614
RGB
rgb(21, 22, 20)
HSL
hsl(90, 5%, 8%)
Luminanz
0,008
Crisp Lettuce #519585
RGB
rgb(81, 149, 133)
HSL
hsl(166, 30%, 45%)
Luminanz
0,249
Seiheki Green #376862
RGB
rgb(55, 104, 98)
HSL
hsl(173, 31%, 31%)
Luminanz
0,116
Pine Hollow #203F42
RGB
rgb(32, 63, 66)
HSL
hsl(185, 35%, 19%)
Luminanz
0,043
Ore Bluish Black #19343A
RGB
rgb(25, 52, 58)
HSL
hsl(191, 40%, 16%)
Luminanz
0,030

Kontrast & Barrierefreiheit

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

Aa #BABE7C auf #151614 9,29:1 AAA
Aa #BABE7C auf #1C1C17 8,75:1 AAA
Aa #BABE7C auf #2F2D22 7,07:1 AAA
Aa #BABE7C auf #19343A 6,74:1 AA
Aa #BABE7C auf #203F42 5,80:1 AA
Aa #BABE7C auf #373F34 5,59:1 AA
Aa #BABE7C auf #443F2D 5,39:1 AA
Aa #151614 auf #519585 5,18:1 AA
Aa #1C1C17 auf #519585 4,88:1 AA
Aa #7D825A auf #151614 4,51:1 AA
Aa #BABE7C auf #49513E 4,25:1 AA (großer Text)
Aa #7D825A auf #1C1C17 4,25:1 AA (großer Text)
Aa #2F2D22 auf #519585 3,94:1 AA (großer Text)
Aa #519585 auf #19343A 3,76:1 AA (großer Text)
Aa #7D825A auf #2F2D22 3,43:1 AA (großer Text)
Aa #7D825A auf #19343A 3,27:1 AA (großer Text)
Aa #BABE7C auf #376862 3,24:1 AA (großer Text)
Aa #519585 auf #203F42 3,23:1 AA (großer Text)
Aa #373F34 auf #519585 3,11:1 AA (großer Text)
Aa #443F2D auf #519585 3,00:1 AA (großer Text)
Aa #151614 auf #376862 2,87:1 Nicht bestanden
Aa #7D825A auf #203F42 2,82:1 Nicht bestanden
Aa #7D825A auf #373F34 2,71:1 Nicht bestanden
Aa #1C1C17 auf #376862 2,70:1 Nicht bestanden
Aa #7D825A auf #443F2D 2,61:1 Nicht bestanden
Aa #49513E auf #519585 2,37:1 Nicht bestanden
Aa #49513E auf #151614 2,19:1 Nicht bestanden
Aa #2F2D22 auf #376862 2,18:1 Nicht bestanden
Aa #376862 auf #19343A 2,08:1 Nicht bestanden
Aa #BABE7C auf #7D825A 2,06:1 Nicht bestanden
Aa #7D825A auf #49513E 2,06:1 Nicht bestanden
Aa #49513E auf #1C1C17 2,06:1 Nicht bestanden
Aa #519585 auf #376862 1,80:1 Nicht bestanden
Aa #BABE7C auf #519585 1,79:1 Nicht bestanden
Aa #376862 auf #203F42 1,79:1 Nicht bestanden
Aa #373F34 auf #376862 1,73:1 Nicht bestanden
Aa #443F2D auf #151614 1,72:1 Nicht bestanden
Aa #49513E auf #2F2D22 1,67:1 Nicht bestanden
Aa #373F34 auf #151614 1,66:1 Nicht bestanden
Aa #443F2D auf #376862 1,66:1 Nicht bestanden
Aa #443F2D auf #1C1C17 1,62:1 Nicht bestanden
Aa #151614 auf #203F42 1,60:1 Nicht bestanden
Aa #49513E auf #19343A 1,59:1 Nicht bestanden
Aa #7D825A auf #376862 1,57:1 Nicht bestanden
Aa #373F34 auf #1C1C17 1,57:1 Nicht bestanden
Aa #1C1C17 auf #203F42 1,51:1 Nicht bestanden
Aa #151614 auf #19343A 1,38:1 Nicht bestanden
Aa #49513E auf #203F42 1,37:1 Nicht bestanden
Aa #49513E auf #373F34 1,32:1 Nicht bestanden
Aa #49513E auf #376862 1,31:1 Nicht bestanden
Aa #443F2D auf #2F2D22 1,31:1 Nicht bestanden
Aa #2F2D22 auf #151614 1,31:1 Nicht bestanden
Aa #1C1C17 auf #19343A 1,30:1 Nicht bestanden
Aa #49513E auf #443F2D 1,27:1 Nicht bestanden
Aa #373F34 auf #2F2D22 1,27:1 Nicht bestanden
Aa #443F2D auf #19343A 1,25:1 Nicht bestanden
Aa #2F2D22 auf #1C1C17 1,24:1 Nicht bestanden
Aa #2F2D22 auf #203F42 1,22:1 Nicht bestanden
Aa #373F34 auf #19343A 1,21:1 Nicht bestanden
Aa #203F42 auf #19343A 1,16:1 Nicht bestanden
Aa #7D825A auf #519585 1,15:1 Nicht bestanden
Aa #443F2D auf #203F42 1,08:1 Nicht bestanden
Aa #1C1C17 auf #151614 1,06:1 Nicht bestanden
Aa #2F2D22 auf #19343A 1,05:1 Nicht bestanden
Aa #373F34 auf #443F2D 1,04:1 Nicht bestanden
Aa #373F34 auf #203F42 1,04:1 Nicht bestanden

Ähnliche Paletten

#000000 #3D0000 #950101 #FF0000
4 Farben
#E23E57 #88304E #522546 #311D3F
4 Farben
#FF204E #A0153E #5D0E41 #00224D
4 Farben
#030637 #3C0753 #720455 #910A67
4 Farben
#1C0A00 #361500 #603601 #CC9544
4 Farben
#252525 #FF0000 #AF0404 #414141
4 Farben
#362222 #171010 #423F3E #2B2B2B
4 Farben
#1A1A1D #3B1C32 #6A1E55 #A64D79
4 Farben