Adlandırılmış renk · #6A8779
Sycamore Grove
Sycamore Grove, #6A8779: rgb(106 135 121), hsl(151 12% 47%), oklch(0.597 0.039 164.1). Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
What does Green mean? → · Sycamore Grove color name →
#6A8779
oklch(0.597 0.039 164.1)
Renk dönüşümleri
- HEX
- #6a8779
- RGB
- rgb(106 135 121)
- HSL
- hsl(151 12% 47%)
- HWB
- hwb(151 42% 47%)
- OKLCH
- oklch(0.597 0.039 164.1)
- OKLab
- oklab(0.597 -0.038 0.011)
- CIE Lab
- lab(53.74 -13.02 3.99)
- LCH
- lch(53.74 13.62 163)
- CMYK
- cmyk(21% 0% 10% 47%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- 789286
- 869E92
- 95AA9F
- A4B5AC
- B2C1BA
- C1CDC7
- D0DAD5
- E0E6E3
- EFF2F1
Koyu tonlar
- 5B7568
- 4D6358
- 3F5148
- 314139
- 24312B
- 18211D
- 0D1310
- 040605
- 000101
Gri tonlar
- 6C867A
- 6F867A
- 71857B
- 73847C
- 75847D
- 78837D
- 7A827E
- 7C817F
- 7E817F
Renk uyumları
Tamamlayıcı +180°
- 6A8779
Sycamore Grove
- 917685
≈ Tragic Juliet
Analog -30° +30°
- 6A8779
Sycamore Grove
- 76856D
≈ Wreath
- 648786
≈ Arctic
Üçlü +120° +240°
- 6A8779
Sycamore Grove
- 7C7C96
≈ Waterloo
- 94786C
≈ Buffalo Soldier
Bölünmüş tamamlayıcı +150° +210°
- 6A8779
Sycamore Grove
- 887990
≈ Classical Violet
- 957678
≈ Chocolaty
Dörtlü +90° +180° +270°
- 6A8779
Sycamore Grove
- 6F8197
≈ Grey Blueberry
- 917685
≈ Tragic Juliet
- 8E7C66
≈ Eagle’s Meadow
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 3.92:1 · APCA Lc 67
Ag
AASiyah üzerinde
WCAG 5.35:1 · APCA Lc 35
En iyi metin rengi: #000000
WCAG 5.35:1 (AA) · APCA Lc 35
Contrast pairs
Kod parçacıkları
CSS
:root {
--sycamore-grove: #6a8779;
--sycamore-grove-rgb: 106 135 121;
--sycamore-grove-oklch: oklch(0.597 0.039 164.1);
}
.element {
color: var(--sycamore-grove);
background-color: hsl(151 12% 47%);
border-color: oklch(0.597 0.039 164.1);
}Tailwind CSS v4
@theme {
--color-sycamore-grove: #6a8779;
--color-sycamore-grove-50: #ebf9f2;
--color-sycamore-grove-100: #dcece5;
--color-sycamore-grove-200: #c5dad0;
--color-sycamore-grove-300: #a5beb3;
--color-sycamore-grove-400: #8aa698;
--color-sycamore-grove-500: #6e8f7f;
--color-sycamore-grove-600: #5e796c;
--color-sycamore-grove-700: #4b6156;
--color-sycamore-grove-800: #36473e;
--color-sycamore-grove-900: #25312b;
--color-sycamore-grove-950: #141d18;
}SCSS
$sycamore-grove: #6a8779;
$sycamore-grove-rgb: 106, 135, 121;
$sycamore-grove-light: mix(#fff, $sycamore-grove, 20%);
$sycamore-grove-dark: mix(#000, $sycamore-grove, 20%);
.element {
color: $sycamore-grove;
box-shadow: 0 0 0 2px rgba($sycamore-grove, 0.35);
}