Colore con nome · #578270
Frosty Spruce
Frosty Spruce è #578270: rgb(87 130 112), hsl(155 20% 43%), oklch(0.57 0.055 166.4). Scopri tinte, ombre, armonie, contrasto WCAG e APCA e codice CSS, Tailwind v4 e SCSS.
What does Green mean? → · Frosty Spruce color name →
#578270
oklch(0.57 0.055 166.4)
Conversioni di colore
- HEX
- #578270
- RGB
- rgb(87 130 112)
- HSL
- hsl(155 20% 43%)
- HWB
- hwb(155 34% 49%)
- OKLCH
- oklch(0.57 0.055 166.4)
- OKLab
- oklab(0.57 -0.054 0.013)
- CIE Lab
- lab(50.81 -18.64 4.81)
- LCH
- lch(50.81 19.25 165.5)
- CMYK
- cmyk(33% 0% 14% 49%)
Tinte · Ombre · Toni
Tinte
- 678E7D
- 789A8B
- 88A699
- 98B2A7
- A9BFB5
- BACBC3
- CBD8D2
- DCE5E1
- EDF2F0
Ombre
- 4B7060
- 3E5F51
- 334E43
- 273E35
- 1C2F27
- 12201A
- 08120E
- 030604
- 000101
Toni
- 5C8272
- 608273
- 648275
- 698176
- 6D8178
- 71817A
- 75817B
- 79817D
- 7C807E
Armonie di colore
Complementare +180°
- 578270
Frosty Spruce
- 906A7E
≈ Milkwort Red
Analogo -30° +30°
- 578270
Frosty Spruce
- 687F5F
≈ Emerald City
- 4E8282
≈ Paradiso
Triadico +120° +240°
- 578270
Frosty Spruce
- 747397
≈ Rhythm
- 936D5C
≈ Monterey Brown
Complementare divisa +150° +210°
- 578270
Frosty Spruce
- 846D8D
≈ Grey Purple
- 956A6C
≈ San Francisco Mauve
Tetradico +90° +180° +270°
- 578270
Frosty Spruce
- 627998
≈ Chicory Flower
- 906A7E
≈ Milkwort Red
- 8A7352
≈ Tobacco Leaf
Contrasto e accessibilità
Ag
FailSu bianco
WCAG 4.34:1 · APCA Lc 70
Ag
AASu nero
WCAG 4.83:1 · APCA Lc 32
Miglior colore del testo: #000000
WCAG 4.83:1 (AA) · APCA Lc 32
Contrast pairs
Frammenti di codice
CSS
:root {
--frosty-spruce: #578270;
--frosty-spruce-rgb: 87 130 112;
--frosty-spruce-oklch: oklch(0.57 0.055 166.4);
}
.element {
color: var(--frosty-spruce);
background-color: hsl(155 20% 43%);
border-color: oklch(0.57 0.055 166.4);
}Tailwind CSS v4
@theme {
--color-frosty-spruce: #578270;
--color-frosty-spruce-50: #e7fbf2;
--color-frosty-spruce-100: #d7eee4;
--color-frosty-spruce-200: #bedcd0;
--color-frosty-spruce-300: #9dc1b2;
--color-frosty-spruce-400: #7fa997;
--color-frosty-spruce-500: #62927e;
--color-frosty-spruce-600: #537c6b;
--color-frosty-spruce-700: #426355;
--color-frosty-spruce-800: #30493d;
--color-frosty-spruce-900: #21322a;
--color-frosty-spruce-950: #101e18;
}SCSS
$frosty-spruce: #578270;
$frosty-spruce-rgb: 87, 130, 112;
$frosty-spruce-light: mix(#fff, $frosty-spruce, 20%);
$frosty-spruce-dark: mix(#000, $frosty-spruce, 20%);
.element {
color: $frosty-spruce;
box-shadow: 0 0 0 2px rgba($frosty-spruce, 0.35);
}