Colore con nome · #676D43
Coconut Grove
Coconut Grove è #676D43: rgb(103 109 67), hsl(69 24% 35%), oklch(0.519 0.062 115.2). Scopri tinte, ombre, armonie, contrasto WCAG e APCA e codice CSS, Tailwind v4 e SCSS.
What does Yellow mean? → · Coconut Grove color name →
#676D43
oklch(0.519 0.062 115.2)
Conversioni di colore
- HEX
- #676d43
- RGB
- rgb(103 109 67)
- HSL
- hsl(69 24% 35%)
- HWB
- hwb(69 26% 57%)
- OKLCH
- oklch(0.519 0.062 115.2)
- OKLab
- oklab(0.519 -0.026 0.056)
- CIE Lab
- lab(44.69 -7.82 22.66)
- LCH
- lch(44.69 23.97 109)
- CMYK
- cmyk(6% 0% 39% 57%)
Tinte · Ombre · Toni
Tinte
- 757B55
- 838967
- 929779
- A1A58B
- B0B49E
- BFC2B0
- CFD1C4
- DFE0D7
- EFF0EB
Ombre
- 595E39
- 4B4F2F
- 3D4126
- 30331D
- 232614
- 17190C
- 0C0D05
- 040401
- 000100
Toni
- 696F49
- 6C7150
- 6E7356
- 71755C
- 737762
- 767968
- 787A6E
- 7B7C74
- 7D7E7A
Armonie di colore
Complementare +180°
- 676D43
Coconut Grove
- 6B6289
≈ Posy Purple
Analogo -30° +30°
- 676D43
Coconut Grove
- 79663E
≈ Eminent Bronze
- 527253
≈ Irish Clover
Triadico +120° +240°
- 676D43
Coconut Grove
- 446E87
≈ Crashing Waves
- 855A6A
≈ Tulipwood
Complementare divisa +150° +210°
- 676D43
Coconut Grove
- 57688D
≈ Allegiance
- 7B5C7C
≈ Gala Ball
Tetradico +90° +180° +270°
- 676D43
Coconut Grove
- 38737A
≈ Peabody
- 6B6289
≈ Posy Purple
- 895B56
≈ Red Willow
Contrasto e accessibilità
Ag
AASu bianco
WCAG 5.46:1 · APCA Lc 77
Ag
FailSu nero
WCAG 3.84:1 · APCA Lc 25
Miglior colore del testo: #FFFFFF
WCAG 5.46:1 (AA) · APCA Lc 77
Contrast pairs
Frammenti di codice
CSS
:root {
--coconut-grove: #676d43;
--coconut-grove-rgb: 103 109 67;
--coconut-grove-oklch: oklch(0.519 0.062 115.2);
}
.element {
color: var(--coconut-grove);
background-color: hsl(69 24% 35%);
border-color: oklch(0.519 0.062 115.2);
}Tailwind CSS v4
@theme {
--color-coconut-grove: #676d43;
--color-coconut-grove-50: #f3f8e4;
--color-coconut-grove-100: #e6ebd4;
--color-coconut-grove-200: #d2d8bb;
--color-coconut-grove-300: #b5bc98;
--color-coconut-grove-400: #9da379;
--color-coconut-grove-500: #848b5b;
--color-coconut-grove-600: #70764e;
--color-coconut-grove-700: #5a5e3e;
--color-coconut-grove-800: #42452c;
--color-coconut-grove-900: #2e301d;
--color-coconut-grove-950: #1a1c0d;
}SCSS
$coconut-grove: #676d43;
$coconut-grove-rgb: 103, 109, 67;
$coconut-grove-light: mix(#fff, $coconut-grove, 20%);
$coconut-grove-dark: mix(#000, $coconut-grove, 20%);
.element {
color: $coconut-grove;
box-shadow: 0 0 0 2px rgba($coconut-grove, 0.35);
}