Adlandırılmış renk · #E1DF9A
Celery Sceptre
Celery Sceptre, #E1DF9A: rgb(225 223 154), hsl(58 54% 74%), oklch(0.889 0.089 106.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? → · Celery Sceptre color name →
#E1DF9A
oklch(0.889 0.089 106.7)
Renk dönüşümleri
- HEX
- #e1df9a
- RGB
- rgb(225 223 154)
- HSL
- hsl(58 54% 74%)
- HWB
- hwb(58 60% 12%)
- OKLCH
- oklch(0.889 0.089 106.7)
- OKLab
- oklab(0.889 -0.025 0.085)
- CIE Lab
- lab(87.78 -6.97 34.17)
- LCH
- lch(87.78 34.88 101.5)
- CMYK
- cmyk(0% 1% 32% 12%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- E4E2A5
- E7E6AF
- EAE9B9
- EDECC3
- F0EFCD
- F3F2D7
- F6F6E1
- F9F9EB
- FCFCF5
Koyu tonlar
- C4C285
- A7A571
- 8B8A5E
- 706F4B
- 565639
- 3E3D27
- 272717
- 121209
- 020201
Gri tonlar
- D7D598
- CDCB96
- C3C293
- B9B891
- AFAF8F
- A5A58C
- 9C9C89
- 929286
- 898983
Renk uyumları
Tamamlayıcı +180°
- E1DF9A
Celery Sceptre
- D7D6FF
≈ Pale Phthalo Blue
Analog -30° +30°
- E1DF9A
Celery Sceptre
- FCD398
≈ Paw Paw
- C0E9AF
≈ Ice Ice
Üçlü +120° +240°
- E1DF9A
Celery Sceptre
- A9E5FF
≈ Frozen Landscape
- FFC8E4
≈ Soulmate Pink
Bölünmüş tamamlayıcı +150° +210°
- E1DF9A
Celery Sceptre
- C4DDFF
≈ Arc Light
- F1CAFF
≈ Sparkling Lavender
Dörtlü +90° +180° +270°
- E1DF9A
Celery Sceptre
- 90EDEE
≈ Bath Water
- D7D6FF
≈ Pale Phthalo Blue
- FFCCCD
≈ Lusty-Gallant
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 1.37:1 · APCA Lc 18
Ag
AAASiyah üzerinde
WCAG 15.22:1 · APCA Lc 85
En iyi metin rengi: #000000
WCAG 15.22:1 (AAA) · APCA Lc 85
Contrast pairs
Kod parçacıkları
CSS
:root {
--celery-sceptre: #e1df9a;
--celery-sceptre-rgb: 225 223 154;
--celery-sceptre-oklch: oklch(0.889 0.089 106.7);
}
.element {
color: var(--celery-sceptre);
background-color: hsl(58 54% 74%);
border-color: oklch(0.889 0.089 106.7);
}Tailwind CSS v4
@theme {
--color-celery-sceptre: #e1df9a;
--color-celery-sceptre-50: #f7f8db;
--color-celery-sceptre-100: #eaebc9;
--color-celery-sceptre-200: #d7d8ac;
--color-celery-sceptre-300: #bbbc87;
--color-celery-sceptre-400: #a4a263;
--color-celery-sceptre-500: #8d8a3f;
--color-celery-sceptre-600: #777536;
--color-celery-sceptre-700: #605d2b;
--color-celery-sceptre-800: #47441d;
--color-celery-sceptre-900: #312f13;
--color-celery-sceptre-950: #1d1b05;
}SCSS
$celery-sceptre: #e1df9a;
$celery-sceptre-rgb: 225, 223, 154;
$celery-sceptre-light: mix(#fff, $celery-sceptre, 20%);
$celery-sceptre-dark: mix(#000, $celery-sceptre, 20%);
.element {
color: $celery-sceptre;
box-shadow: 0 0 0 2px rgba($celery-sceptre, 0.35);
}