Adlandırılmış renk · #C4B198
Tender Taupe
Tender Taupe, #C4B198: rgb(196 177 152), hsl(34 27% 68%), oklch(0.77 0.041 74.7). Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
What does Orange mean? → · Tender Taupe color name →
#C4B198
oklch(0.77 0.041 74.7)
Renk dönüşümleri
- HEX
- #c4b198
- RGB
- rgb(196 177 152)
- HSL
- hsl(34 27% 68%)
- HWB
- hwb(34 60% 23%)
- OKLCH
- oklch(0.77 0.041 74.7)
- OKLab
- oklab(0.77 0.011 0.039)
- CIE Lab
- lab(73.35 4.11 15.46)
- LCH
- lch(73.35 16 75.1)
- CMYK
- cmyk(0% 10% 22% 23%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- CAB9A2
- D0C0AC
- D6C8B6
- DBD0C0
- E1D7CB
- E7DFD5
- EDE7DF
- F3EFEA
- F9F7F4
Koyu tonlar
- AA9984
- 918370
- 786C5C
- 61574A
- 4A4238
- 352F27
- 211C17
- 0E0C08
- 020101
Gri tonlar
- BDAC96
- B6A793
- AFA291
- A89D8F
- A1988C
- 9B938A
- 948E87
- 8D8A85
- 878582
Renk uyumları
Tamamlayıcı +180°
- C4B198
Tender Taupe
- A3B6CE
≈ Misted Eve
Analog -30° +30°
- C4B198
Tender Taupe
- CCAD9F
≈ Art Deco Pink
- B8B698
≈ Disguise
Üçlü +120° +240°
- C4B198
Tender Taupe
- 97BDBC
≈ Turner’s Light
- BEADC7
≈ Fancy Pansy
Bölünmüş tamamlayıcı +150° +210°
- C4B198
Tender Taupe
- 99BAC8
≈ Sydney Harbour
- B1B1CE
≈ Lavender Dream
Dörtlü +90° +180° +270°
- C4B198
Tender Taupe
- 9DBDAE
≈ White Spruce
- A3B6CE
≈ Misted Eve
- C8AABA
≈ Fragrant Lilac
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 2.08:1 · APCA Lc 41
Ag
AAASiyah üzerinde
WCAG 10.08:1 · APCA Lc 62
En iyi metin rengi: #000000
WCAG 10.08:1 (AAA) · APCA Lc 62
Contrast pairs
Kod parçacıkları
CSS
:root {
--tender-taupe: #c4b198;
--tender-taupe-rgb: 196 177 152;
--tender-taupe-oklch: oklch(0.77 0.041 74.7);
}
.element {
color: var(--tender-taupe);
background-color: hsl(34 27% 68%);
border-color: oklch(0.77 0.041 74.7);
}Tailwind CSS v4
@theme {
--color-tender-taupe: #c4b198;
--color-tender-taupe-50: #fcf4e9;
--color-tender-taupe-100: #f0e6d9;
--color-tender-taupe-200: #ded2c1;
--color-tender-taupe-300: #c4b5a1;
--color-tender-taupe-400: #ad9b84;
--color-tender-taupe-500: #978368;
--color-tender-taupe-600: #7f6f59;
--color-tender-taupe-700: #665847;
--color-tender-taupe-800: #4b4033;
--color-tender-taupe-900: #342c23;
--color-tender-taupe-950: #201912;
}SCSS
$tender-taupe: #c4b198;
$tender-taupe-rgb: 196, 177, 152;
$tender-taupe-light: mix(#fff, $tender-taupe, 20%);
$tender-taupe-dark: mix(#000, $tender-taupe, 20%);
.element {
color: $tender-taupe;
box-shadow: 0 0 0 2px rgba($tender-taupe, 0.35);
}