Colore con nome · #8DC2A8
Spearmint Frosting
Spearmint Frosting è #8DC2A8: rgb(141 194 168), hsl(151 30% 66%), oklch(0.77 0.067 163.1). Scopri tinte, ombre, armonie, contrasto WCAG e APCA e codice CSS, Tailwind v4 e SCSS.
What does Green mean? → · Spearmint Frosting color name →
#8DC2A8
oklch(0.77 0.067 163.1)
Conversioni di colore
- HEX
- #8dc2a8
- RGB
- rgb(141 194 168)
- HSL
- hsl(151 30% 66%)
- HWB
- hwb(151 55% 24%)
- OKLCH
- oklch(0.77 0.067 163.1)
- OKLab
- oklab(0.77 -0.064 0.019)
- CIE Lab
- lab(74.17 -22.12 7.27)
- LCH
- lch(74.17 23.28 161.8)
- CMYK
- cmyk(27% 0% 13% 24%)
Tinte · Ombre · Toni
Tinte
- 99C8B0
- A4CEB9
- AFD4C1
- BBDACA
- C6E0D3
- D2E7DB
- DDEDE4
- E8F3ED
- F4F9F6
Ombre
- 7AA892
- 678F7C
- 557767
- 446052
- 33493F
- 23342C
- 14201A
- 070E0A
- 010201
Toni
- 8CBBA4
- 8BB5A0
- 8AAE9C
- 89A798
- 88A194
- 869A90
- 85938C
- 838D88
- 828684
Armonie di colore
Complementare +180°
- 8DC2A8
Spearmint Frosting
- D3A4BF
≈ Enhance
Analogo -30° +30°
- 8DC2A8
Spearmint Frosting
- A4BE92
≈ Praying Mantis
- 80C2C0
≈ Celestine
Triadico +120° +240°
- 8DC2A8
Spearmint Frosting
- AEAFDE
≈ Purple Hibiscus
- DAA792
≈ North Rim
Complementare divisa +150° +210°
- 8DC2A8
Spearmint Frosting
- C3A8D3
≈ Feminine Fancy
- DBA3A8
≈ Prom
Tetradico +90° +180° +270°
- 8DC2A8
Spearmint Frosting
- 96B7DE
≈ Sacred Blue
- D3A4BF
≈ Enhance
- CFAE85
≈ Castell Harlech
Contrasto e accessibilità
Ag
FailSu bianco
WCAG 2.01:1 · APCA Lc 39
Ag
AAASu nero
WCAG 10.41:1 · APCA Lc 63
Miglior colore del testo: #000000
WCAG 10.41:1 (AAA) · APCA Lc 63
Contrast pairs
Frammenti di codice
CSS
:root {
--spearmint-frosting: #8dc2a8;
--spearmint-frosting-rgb: 141 194 168;
--spearmint-frosting-oklch: oklch(0.77 0.067 163.1);
}
.element {
color: var(--spearmint-frosting);
background-color: hsl(151 30% 66%);
border-color: oklch(0.77 0.067 163.1);
}Tailwind CSS v4
@theme {
--color-spearmint-frosting: #8dc2a8;
--color-spearmint-frosting-50: #e4fcf0;
--color-spearmint-frosting-100: #d4efe2;
--color-spearmint-frosting-200: #bbdecd;
--color-spearmint-frosting-300: #98c3af;
--color-spearmint-frosting-400: #7aab93;
--color-spearmint-frosting-500: #5b9479;
--color-spearmint-frosting-600: #4d7d67;
--color-spearmint-frosting-700: #3e6452;
--color-spearmint-frosting-800: #2d4a3b;
--color-spearmint-frosting-900: #1e3328;
--color-spearmint-frosting-950: #0e1f16;
}SCSS
$spearmint-frosting: #8dc2a8;
$spearmint-frosting-rgb: 141, 194, 168;
$spearmint-frosting-light: mix(#fff, $spearmint-frosting, 20%);
$spearmint-frosting-dark: mix(#000, $spearmint-frosting, 20%);
.element {
color: $spearmint-frosting;
box-shadow: 0 0 0 2px rgba($spearmint-frosting, 0.35);
}