GunMetal 12

Palette mit 12 Farben · Kühl · Gemischt · Harmonie: Triadisch

Zurück zur Bibliothek

GunMetal 12

Palette mit 12 Farben · Temperatur: Kühl · Ton: Gemischt · Harmonie: Triadisch

Bearbeiten

Gedeckt 12 Farben Kühl Gemischt Triadisch space neon light metal

Likes 52

Farben 12

CSS-Variablen

:root {
  --c-muted-1: #141127;
  --c-muted-2: #2B2F47;
  --c-muted-3: #3E4761;
  --c-muted-4: #596B87;
  --c-muted-5: #7691B0;
  --c-muted-6: #8CAECF;
  --c-muted-7: #2A3D29;
  --c-muted-8: #3A5F2A;
  --c-muted-9: #47792B;
  --c-muted-10: #518D2C;
  --c-muted-11: #62B12C;
  --c-muted-12: #72CF30;
}

Über diese Palette

Diese gedeckte Palette mit 12 Farben reicht vom hellsten Ton Bitter Dandelion (#72CF30) bis zum dunkelsten Ton Corbeau (#141127). Sie vereint Corbeau, Midnight Masquerade, Anthracite Blue, Aurora Borealis, Wink, Ocean Bubble, Aimiru Brown, Deep Into the Wood, Master Chief, Fresh Onion, Yule Tree und Bitter Dandelion in einem Set, das du direkt in deine Benutzeroberfläche übernehmen kannst. Farbpaare in der Palette: 66. Davon erreichen 11 die WCAG-AA-Kontrastschwelle (4,5:1) für Fließtext – am stärksten ist #141127 auf #72CF30 mit 9,38:1.

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

Farben im Detail

Corbeau #141127

RGB: rgb(20, 17, 39)
HSL: hsl(248, 39%, 11%)
Luminanz: 0,007

Midnight Masquerade #2B2F47

RGB: rgb(43, 47, 71)
HSL: hsl(231, 25%, 22%)
Luminanz: 0,030

Anthracite Blue #3E4761

RGB: rgb(62, 71, 97)
HSL: hsl(225, 22%, 31%)
Luminanz: 0,064

Aurora Borealis #596B87

RGB: rgb(89, 107, 135)
HSL: hsl(217, 21%, 44%)
Luminanz: 0,144

Wink #7691B0

RGB: rgb(118, 145, 176)
HSL: hsl(212, 27%, 58%)
Luminanz: 0,272

Ocean Bubble #8CAECF

RGB: rgb(140, 174, 207)
HSL: hsl(210, 41%, 68%)
Luminanz: 0,404

Aimiru Brown #2A3D29

RGB: rgb(42, 61, 41)
HSL: hsl(117, 20%, 20%)
Luminanz: 0,040

Deep Into the Wood #3A5F2A

RGB: rgb(58, 95, 42)
HSL: hsl(102, 39%, 27%)
Luminanz: 0,093

Master Chief #47792B

RGB: rgb(71, 121, 43)
HSL: hsl(98, 48%, 32%)
Luminanz: 0,152

Fresh Onion #518D2C

RGB: rgb(81, 141, 44)
HSL: hsl(97, 52%, 36%)
Luminanz: 0,210

Yule Tree #62B12C

RGB: rgb(98, 177, 44)
HSL: hsl(96, 60%, 43%)
Luminanz: 0,342

Bitter Dandelion #72CF30

RGB: rgb(114, 207, 48)
HSL: hsl(95, 62%, 50%)
Luminanz: 0,484

Kontrast & Barrierefreiheit

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

Aa #141127 auf #72CF30 9,38:1 AAA

Aa #141127 auf #8CAECF 7,96:1 AAA

Aa #141127 auf #62B12C 6,89:1 AA

Aa #2B2F47 auf #72CF30 6,68:1 AA

Aa #2A3D29 auf #72CF30 5,94:1 AA

Aa #2B2F47 auf #8CAECF 5,67:1 AA

Aa #141127 auf #7691B0 5,66:1 AA

Aa #8CAECF auf #2A3D29 5,04:1 AA

Aa #2B2F47 auf #62B12C 4,90:1 AA

Aa #3E4761 auf #72CF30 4,69:1 AA

Aa #141127 auf #518D2C 4,56:1 AA

Aa #2A3D29 auf #62B12C 4,36:1 AA (großer Text)

Aa #2B2F47 auf #7691B0 4,03:1 AA (großer Text)

Aa #3E4761 auf #8CAECF 3,98:1 AA (großer Text)

Aa #3A5F2A auf #72CF30 3,75:1 AA (großer Text)

Aa #7691B0 auf #2A3D29 3,59:1 AA (großer Text)

Aa #141127 auf #47792B 3,54:1 AA (großer Text)

Aa #3E4761 auf #62B12C 3,44:1 AA (großer Text)

Aa #141127 auf #596B87 3,40:1 AA (großer Text)

Aa #2B2F47 auf #518D2C 3,25:1 AA (großer Text)

Aa #8CAECF auf #3A5F2A 3,18:1 AA (großer Text)

Aa #2A3D29 auf #518D2C 2,89:1 Nicht bestanden

Aa #3E4761 auf #7691B0 2,83:1 Nicht bestanden

Aa #596B87 auf #72CF30 2,76:1 Nicht bestanden

Aa #3A5F2A auf #62B12C 2,75:1 Nicht bestanden

Aa #47792B auf #72CF30 2,65:1 Nicht bestanden

Aa #2B2F47 auf #47792B 2,52:1 Nicht bestanden

Aa #141127 auf #3A5F2A 2,50:1 Nicht bestanden

Aa #2B2F47 auf #596B87 2,42:1 Nicht bestanden

Aa #596B87 auf #8CAECF 2,34:1 Nicht bestanden

Aa #3E4761 auf #518D2C 2,28:1 Nicht bestanden

Aa #7691B0 auf #3A5F2A 2,26:1 Nicht bestanden

Aa #8CAECF auf #47792B 2,25:1 Nicht bestanden

Aa #2A3D29 auf #47792B 2,25:1 Nicht bestanden

Aa #596B87 auf #2A3D29 2,16:1 Nicht bestanden

Aa #518D2C auf #72CF30 2,06:1 Nicht bestanden

Aa #596B87 auf #62B12C 2,02:1 Nicht bestanden

Aa #141127 auf #3E4761 2,00:1 Nicht bestanden

Aa #47792B auf #62B12C 1,94:1 Nicht bestanden

Aa #3A5F2A auf #518D2C 1,82:1 Nicht bestanden

Aa #2B2F47 auf #3A5F2A 1,78:1 Nicht bestanden

Aa #3E4761 auf #47792B 1,77:1 Nicht bestanden

Aa #8CAECF auf #518D2C 1,75:1 Nicht bestanden

Aa #3E4761 auf #596B87 1,70:1 Nicht bestanden

Aa #596B87 auf #7691B0 1,66:1 Nicht bestanden

Aa #7691B0 auf #72CF30 1,66:1 Nicht bestanden

Aa #7691B0 auf #47792B 1,60:1 Nicht bestanden

Aa #2A3D29 auf #3A5F2A 1,59:1 Nicht bestanden

Aa #141127 auf #2A3D29 1,58:1 Nicht bestanden

Aa #518D2C auf #62B12C 1,51:1 Nicht bestanden

Aa #2B2F47 auf #3E4761 1,42:1 Nicht bestanden

Aa #3A5F2A auf #47792B 1,42:1 Nicht bestanden

Aa #7691B0 auf #8CAECF 1,41:1 Nicht bestanden

Aa #141127 auf #2B2F47 1,40:1 Nicht bestanden

Aa #596B87 auf #3A5F2A 1,36:1 Nicht bestanden

Aa #62B12C auf #72CF30 1,36:1 Nicht bestanden

Aa #596B87 auf #518D2C 1,34:1 Nicht bestanden

Aa #47792B auf #518D2C 1,29:1 Nicht bestanden

Aa #3E4761 auf #2A3D29 1,27:1 Nicht bestanden

Aa #3E4761 auf #3A5F2A 1,25:1 Nicht bestanden

Aa #7691B0 auf #518D2C 1,24:1 Nicht bestanden

Aa #7691B0 auf #62B12C 1,22:1 Nicht bestanden

Aa #8CAECF auf #72CF30 1,18:1 Nicht bestanden

Aa #8CAECF auf #62B12C 1,16:1 Nicht bestanden

Aa #2B2F47 auf #2A3D29 1,12:1 Nicht bestanden

Aa #596B87 auf #47792B 1,04:1 Nicht bestanden

GunMetal 12

GunMetal 12

CSS-Variablen

Über diese Palette

Farben im Detail

Kontrast & Barrierefreiheit

Ähnliche Paletten

Schriftarten

Icons & SVG

Farben

Bilder

CSS-Tools

Entwicklung

Dokumentation

Unternehmen