Adlandırılmış renk · #DDCC77
Sand Pyramid
Sand Pyramid, #DDCC77: rgb(221 204 119), hsl(50 60% 67%), oklch(0.841 0.108 98.3). Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
What does Yellow mean? → · Sand Pyramid color name →
#DDCC77
oklch(0.841 0.108 98.3)
Renk dönüşümleri
- HEX
- #ddcc77
- RGB
- rgb(221 204 119)
- HSL
- hsl(50 60% 67%)
- HWB
- hwb(50 47% 13%)
- OKLCH
- oklch(0.841 0.108 98.3)
- OKLab
- oklab(0.841 -0.016 0.107)
- CIE Lab
- lab(82.11 -2.2 44.36)
- LCH
- lch(82.11 44.41 92.8)
- CMYK
- cmyk(0% 8% 46% 13%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- E0D186
- E4D694
- E7DCA2
- EAE1B0
- EEE6BD
- F1EBCB
- F5F0D8
- F8F5E5
- FBFAF2
Koyu tonlar
- C0B167
- A49757
- 887E47
- 6E6538
- 554E2A
- 3D371C
- 262210
- 110F05
- 020201
Gri tonlar
- D3C479
- CABD7B
- C0B57D
- B7AD7E
- ADA67F
- A49E80
- 9B9780
- 928F80
- 898780
Renk uyumları
Tamamlayıcı +180°
- DDCC77
Sand Pyramid
- BEC6FF
≈ Light Periwinkle
Analog -30° +30°
- DDCC77
Sand Pyramid
- F9BE7C
≈ Rich Honey
- B6D98C
≈ Pastel Lime
Üçlü +120° +240°
- DDCC77
Sand Pyramid
- 70DCFA
≈ Athena Blue
- F9B0E3
≈ Hot Aquarelle Pink
Bölünmüş tamamlayıcı +150° +210°
- DDCC77
Sand Pyramid
- A0D0FF
≈ Baby Blue
- DEB9FF
≈ Lavender Fragrance
Dörtlü +90° +180° +270°
- DDCC77
Sand Pyramid
- 6CE2D8
≈ Turquoise Chalk
- BEC6FF
≈ Light Periwinkle
- FFB3BF
≈ Matt Pink
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 1.61:1 · APCA Lc 28
Ag
AAASiyah üzerinde
WCAG 12.97:1 · APCA Lc 75
En iyi metin rengi: #000000
WCAG 12.97:1 (AAA) · APCA Lc 75
Contrast pairs
Kod parçacıkları
CSS
:root {
--sand-pyramid: #ddcc77;
--sand-pyramid-rgb: 221 204 119;
--sand-pyramid-oklch: oklch(0.841 0.108 98.3);
}
.element {
color: var(--sand-pyramid);
background-color: hsl(50 60% 67%);
border-color: oklch(0.841 0.108 98.3);
}Tailwind CSS v4
@theme {
--color-sand-pyramid: #ddcc77;
--color-sand-pyramid-50: #fcf7d4;
--color-sand-pyramid-100: #f0e9c1;
--color-sand-pyramid-200: #ded6a1;
--color-sand-pyramid-300: #c4b978;
--color-sand-pyramid-400: #af9f50;
--color-sand-pyramid-500: #99861e;
--color-sand-pyramid-600: #81721d;
--color-sand-pyramid-700: #685b17;
--color-sand-pyramid-800: #4d420e;
--color-sand-pyramid-900: #362e08;
--color-sand-pyramid-950: #211a00;
}SCSS
$sand-pyramid: #ddcc77;
$sand-pyramid-rgb: 221, 204, 119;
$sand-pyramid-light: mix(#fff, $sand-pyramid, 20%);
$sand-pyramid-dark: mix(#000, $sand-pyramid, 20%);
.element {
color: $sand-pyramid;
box-shadow: 0 0 0 2px rgba($sand-pyramid, 0.35);
}