Adlandırılmış renk · #F0D29D
Willow-Flower Yellow
Willow-Flower Yellow, #F0D29D: rgb(240 210 157), hsl(38 73% 78%), oklch(0.876 0.076 81.6). Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
What does Orange mean? → · Willow-Flower Yellow color name →
#F0D29D
oklch(0.876 0.076 81.6)
Renk dönüşümleri
- HEX
- #f0d29d
- RGB
- rgb(240 210 157)
- HSL
- hsl(38 73% 78%)
- HWB
- hwb(38 62% 6%)
- OKLCH
- oklch(0.876 0.076 81.6)
- OKLab
- oklab(0.876 0.011 0.075)
- CIE Lab
- lab(85.82 5.37 30.4)
- LCH
- lch(85.82 30.87 80)
- CMYK
- cmyk(0% 13% 35% 6%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- F2D7A7
- F3DBB1
- F5E0BB
- F6E4C5
- F8E9CF
- F9EDD8
- FBF2E2
- FCF6EC
- FEFBF5
Koyu tonlar
- D1B688
- B29B73
- 95815F
- 78684C
- 5D503A
- 433928
- 2A2418
- 141009
- 030201
Gri tonlar
- E4CA9A
- D9C198
- CDB995
- C2B192
- B7A890
- ABA08D
- A0988A
- 959086
- 8B8883
Renk uyumları
Tamamlayıcı +180°
- F0D29D
Willow-Flower Yellow
- C1D7FF
≈ Pale Phthalo Blue
Analog -30° +30°
- F0D29D
Willow-Flower Yellow
- FFC9AA
≈ Bleached Apricot
- D7DCA2
≈ Burgundy Grey
Üçlü +120° +240°
- F0D29D
Willow-Flower Yellow
- 99E6EB
≈ Blizzard Blue
- EEC6F5
≈ Purple’s Baby Sister
Bölünmüş tamamlayıcı +150° +210°
- F0D29D
Willow-Flower Yellow
- A5E0FF
≈ Droplet
- D6CFFF
≈ Pale Lavender
Dörtlü +90° +180° +270°
- F0D29D
Willow-Flower Yellow
- A2E7D0
≈ Sweet Aqua
- C1D7FF
≈ Pale Phthalo Blue
- FFC2DC
≈ Sweet Romance
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 1.45:1 · APCA Lc 22
Ag
AAASiyah üzerinde
WCAG 14.41:1 · APCA Lc 82
En iyi metin rengi: #000000
WCAG 14.41:1 (AAA) · APCA Lc 82
Contrast pairs
Kod parçacıkları
CSS
:root {
--willow-flower-yellow: #f0d29d;
--willow-flower-yellow-rgb: 240 210 157;
--willow-flower-yellow-oklch: oklch(0.876 0.076 81.6);
}
.element {
color: var(--willow-flower-yellow);
background-color: hsl(38 73% 78%);
border-color: oklch(0.876 0.076 81.6);
}Tailwind CSS v4
@theme {
--color-willow-flower-yellow: #f0d29d;
--color-willow-flower-yellow-50: #fff4dd;
--color-willow-flower-yellow-100: #f4e6cc;
--color-willow-flower-yellow-200: #e4d2b0;
--color-willow-flower-yellow-300: #cab58b;
--color-willow-flower-yellow-400: #b59a6a;
--color-willow-flower-yellow-500: #a08148;
--color-willow-flower-yellow-600: #876d3e;
--color-willow-flower-yellow-700: #6c5731;
--color-willow-flower-yellow-800: #503f22;
--color-willow-flower-yellow-900: #382c17;
--color-willow-flower-yellow-950: #231908;
}SCSS
$willow-flower-yellow: #f0d29d;
$willow-flower-yellow-rgb: 240, 210, 157;
$willow-flower-yellow-light: mix(#fff, $willow-flower-yellow, 20%);
$willow-flower-yellow-dark: mix(#000, $willow-flower-yellow, 20%);
.element {
color: $willow-flower-yellow;
box-shadow: 0 0 0 2px rgba($willow-flower-yellow, 0.35);
}