En yakın adlandırılmış renk · #4E8565
#4E8565
En yakın adlandırılmış renk: Clouded Pine
#4E8565 (rgb(78 133 101), hsl(145 26% 41%), oklch(0.569 0.077 157.3)) en çok Clouded Pine adlı renge yakındır. Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
#4E8565
oklch(0.569 0.077 157.3)
Renk dönüşümleri
- HEX
- #4e8565
- RGB
- rgb(78 133 101)
- HSL
- hsl(145 26% 41%)
- HWB
- hwb(145 31% 48%)
- OKLCH
- oklch(0.569 0.077 157.3)
- OKLab
- oklab(0.569 -0.071 0.03)
- CIE Lab
- lab(51.03 -24.8 11.35)
- LCH
- lch(51.03 27.27 155.4)
- CMYK
- cmyk(41% 0% 24% 48%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- 609173
- 719D82
- 82A991
- 94B5A0
- A5C1AF
- B7CDBF
- C9D9CE
- DBE6DE
- EDF2EF
Koyu tonlar
- 437357
- 386149
- 2D503C
- 23402F
- 193022
- 0F2117
- 07130C
- 020603
- 000100
Gri tonlar
- 548568
- 5A846B
- 5F846D
- 648370
- 698373
- 6E8275
- 738278
- 77817B
- 7C817D
Renk uyumları
Tamamlayıcı +180°
- 4E8565
Clouded Pine
- 956588
≈ Rust Magenta
Analog -30° +30°
- 4E8565
Clouded Pine
- 6A804D
≈ Woodland Nymph
- 38867F
≈ Copper Turquoise
Üçlü +120° +240°
- 4E8565
Clouded Pine
- 6C73A5
≈ Mountain Flower Mauve
- 9F6756
≈ Granrojo Jellyfish
Bölünmüş tamamlayıcı +150° +210°
- 4E8565
Clouded Pine
- 836B9B
≈ Bitter Violet
- 9E646F
≈ Deco Rose
Dörtlü +90° +180° +270°
- 4E8565
Clouded Pine
- 517BA2
≈ Parisian Blue
- 956588
≈ Rust Magenta
- 966E44
≈ Tavern Creek
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 4.31:1 · APCA Lc 70
Ag
AASiyah üzerinde
WCAG 4.86:1 · APCA Lc 32
En iyi metin rengi: #000000
WCAG 4.86:1 (AA) · APCA Lc 32
Contrast pairs
Kod parçacıkları
CSS
:root {
--clouded-pine: #4e8565;
--clouded-pine-rgb: 78 133 101;
--clouded-pine-oklch: oklch(0.569 0.077 157.3);
}
.element {
color: var(--clouded-pine);
background-color: hsl(145 26% 41%);
border-color: oklch(0.569 0.077 157.3);
}Tailwind CSS v4
@theme {
--color-clouded-pine: #4e8565;
--color-clouded-pine-50: #e3fced;
--color-clouded-pine-100: #d3f0df;
--color-clouded-pine-200: #b9dfc9;
--color-clouded-pine-300: #96c4a9;
--color-clouded-pine-400: #78ad8c;
--color-clouded-pine-500: #589672;
--color-clouded-pine-600: #4b7f61;
--color-clouded-pine-700: #3c654d;
--color-clouded-pine-800: #2b4a37;
--color-clouded-pine-900: #1d3425;
--color-clouded-pine-950: #0d1f14;
}SCSS
$clouded-pine: #4e8565;
$clouded-pine-rgb: 78, 133, 101;
$clouded-pine-light: mix(#fff, $clouded-pine, 20%);
$clouded-pine-dark: mix(#000, $clouded-pine, 20%);
.element {
color: $clouded-pine;
box-shadow: 0 0 0 2px rgba($clouded-pine, 0.35);
}