Adlandırılmış renk · #A2AC86
Cucumber Crush
Cucumber Crush, #A2AC86: rgb(162 172 134), hsl(76 19% 60%), oklch(0.726 0.054 119.7). Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
What does Yellow mean? → · Cucumber Crush color name →
#A2AC86
oklch(0.726 0.054 119.7)
Renk dönüşümleri
- HEX
- #a2ac86
- RGB
- rgb(162 172 134)
- HSL
- hsl(76 19% 60%)
- HWB
- hwb(76 53% 33%)
- OKLCH
- oklch(0.726 0.054 119.7)
- OKLab
- oklab(0.726 -0.027 0.047)
- CIE Lab
- lab(68.79 -8.64 18.39)
- LCH
- lch(68.79 20.32 115.2)
- CMYK
- cmyk(6% 0% 22% 33%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- ABB492
- B4BC9E
- BDC4A9
- C6CDB5
- CFD5C1
- D9DDCE
- E2E6DA
- ECEEE6
- F5F6F3
Koyu tonlar
- 8C9574
- 777F62
- 636951
- 4F5440
- 3C4030
- 2A2D21
- 191B13
- 0A0B06
- 010101
Gri tonlar
- 9FA886
- 9BA385
- 989F85
- 949A84
- 919684
- 8D9183
- 8A8D82
- 878982
- 838481
Renk uyumları
Tamamlayıcı +180°
- A2AC86
Cucumber Crush
- AB9FC4
≈ Evening Slipper
Analog -30° +30°
- A2AC86
Cucumber Crush
- B4A680
≈ Sedia
- 8FB195
≈ Morris Artichoke
Üçlü +120° +240°
- A2AC86
Cucumber Crush
- 88ACC5
≈ Colorado Springs
- C499A5
≈ Artichoke Mauve
Bölünmüş tamamlayıcı +150° +210°
- A2AC86
Cucumber Crush
- 99A6C9
≈ Sapphire Fog
- BB9BB7
≈ Tuileries Tint
Dörtlü +90° +180° +270°
- A2AC86
Cucumber Crush
- 7FB0B9
≈ Flotation
- AB9FC4
≈ Evening Slipper
- C69A93
≈ Fall Canyon
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 2.39:1 · APCA Lc 47
Ag
AAASiyah üzerinde
WCAG 8.78:1 · APCA Lc 55
En iyi metin rengi: #000000
WCAG 8.78:1 (AAA) · APCA Lc 55
Contrast pairs
Kod parçacıkları
CSS
:root {
--cucumber-crush: #a2ac86;
--cucumber-crush-rgb: 162 172 134;
--cucumber-crush-oklch: oklch(0.726 0.054 119.7);
}
.element {
color: var(--cucumber-crush);
background-color: hsl(76 19% 60%);
border-color: oklch(0.726 0.054 119.7);
}Tailwind CSS v4
@theme {
--color-cucumber-crush: #a2ac86;
--color-cucumber-crush-50: #f2f8e7;
--color-cucumber-crush-100: #e5ebd7;
--color-cucumber-crush-200: #d0d8bf;
--color-cucumber-crush-300: #b3bc9e;
--color-cucumber-crush-400: #9aa480;
--color-cucumber-crush-500: #818c63;
--color-cucumber-crush-600: #6e7654;
--color-cucumber-crush-700: #585f43;
--color-cucumber-crush-800: #414530;
--color-cucumber-crush-900: #2c3020;
--color-cucumber-crush-950: #1a1c10;
}SCSS
$cucumber-crush: #a2ac86;
$cucumber-crush-rgb: 162, 172, 134;
$cucumber-crush-light: mix(#fff, $cucumber-crush, 20%);
$cucumber-crush-dark: mix(#000, $cucumber-crush, 20%);
.element {
color: $cucumber-crush;
box-shadow: 0 0 0 2px rgba($cucumber-crush, 0.35);
}