Adlandırılmış renk · #CDBB9C
Tumblin’ Tumbleweed
Tumblin’ Tumbleweed, #CDBB9C: rgb(205 187 156), hsl(38 33% 71%), oklch(0.799 0.047 81.3). Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
What does Orange mean? → · Tumblin’ Tumbleweed color name →
#CDBB9C
oklch(0.799 0.047 81.3)
Renk dönüşümleri
- HEX
- #cdbb9c
- RGB
- rgb(205 187 156)
- HSL
- hsl(38 33% 71%)
- HWB
- hwb(38 61% 20%)
- OKLCH
- oklch(0.799 0.047 81.3)
- OKLab
- oklab(0.799 0.007 0.046)
- CIE Lab
- lab(76.81 3.01 18.21)
- LCH
- lch(76.81 18.46 80.6)
- CMYK
- cmyk(0% 9% 24% 20%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- D2C2A6
- D7C8AF
- DCCFB9
- E1D6C3
- E6DDCD
- EBE3D7
- F0EAE1
- F5F1EB
- FAF8F5
Koyu tonlar
- B2A287
- 988A73
- 7E735F
- 665C4C
- 4E4639
- 383228
- 231F18
- 0F0D09
- 020201
Gri tonlar
- C5B599
- BDAF97
- B5A994
- ADA391
- A69D8E
- 9E978B
- 969189
- 8F8C86
- 878683
Renk uyumları
Tamamlayıcı +180°
- CDBB9C
Tumblin’ Tumbleweed
- ADBEDC
≈ Pigeon Post
Analog -30° +30°
- CDBB9C
Tumblin’ Tumbleweed
- D7B6A3
≈ Sedona Pink
- BEC19F
≈ Chameleon Tango
Üçlü +120° +240°
- CDBB9C
Tumblin’ Tumbleweed
- 9BC7CA
≈ Continental Waters
- CCB4D0
≈ Elfin Herb
Bölünmüş tamamlayıcı +150° +210°
- CDBB9C
Tumblin’ Tumbleweed
- A0C4D7
≈ Blue Bows
- BDB9DA
≈ Playful Purple
Dörtlü +90° +180° +270°
- CDBB9C
Tumblin’ Tumbleweed
- A0C8BA
≈ Cool Juniper
- ADBEDC
≈ Pigeon Post
- D6B2C1
≈ Mauvelous
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 1.87:1 · APCA Lc 36
Ag
AAASiyah üzerinde
WCAG 11.18:1 · APCA Lc 67
En iyi metin rengi: #000000
WCAG 11.18:1 (AAA) · APCA Lc 67
Contrast pairs
Kod parçacıkları
CSS
:root {
--tumblin-tumbleweed: #cdbb9c;
--tumblin-tumbleweed-rgb: 205 187 156;
--tumblin-tumbleweed-oklch: oklch(0.799 0.047 81.3);
}
.element {
color: var(--tumblin-tumbleweed);
background-color: hsl(38 33% 71%);
border-color: oklch(0.799 0.047 81.3);
}Tailwind CSS v4
@theme {
--color-tumblin-tumbleweed: #cdbb9c;
--color-tumblin-tumbleweed-50: #fcf4e6;
--color-tumblin-tumbleweed-100: #efe7d7;
--color-tumblin-tumbleweed-200: #ded3be;
--color-tumblin-tumbleweed-300: #c3b69d;
--color-tumblin-tumbleweed-400: #ad9c80;
--color-tumblin-tumbleweed-500: #968363;
--color-tumblin-tumbleweed-600: #7f6f54;
--color-tumblin-tumbleweed-700: #665943;
--color-tumblin-tumbleweed-800: #4b4130;
--color-tumblin-tumbleweed-900: #342d21;
--color-tumblin-tumbleweed-950: #201a10;
}SCSS
$tumblin-tumbleweed: #cdbb9c;
$tumblin-tumbleweed-rgb: 205, 187, 156;
$tumblin-tumbleweed-light: mix(#fff, $tumblin-tumbleweed, 20%);
$tumblin-tumbleweed-dark: mix(#000, $tumblin-tumbleweed, 20%);
.element {
color: $tumblin-tumbleweed;
box-shadow: 0 0 0 2px rgba($tumblin-tumbleweed, 0.35);
}