لون مسمّى · #FCB057
Duckling
Duckling هو #FCB057: rgb(252 176 87)، hsl(32 96% 66%)، oklch(0.814 0.137 68). شاهد الدرجات الفاتحة والداكنة والتناسقات وتباين WCAG وAPCA وأكواد CSS وTailwind v4 وSCSS.
What does Orange mean? → · Duckling color name →
#FCB057
oklch(0.814 0.137 68)
تحويلات الألوان
- HEX
- #fcb057
- RGB
- rgb(252 176 87)
- HSL
- hsl(32 96% 66%)
- HWB
- hwb(32 34% 1%)
- OKLCH
- oklch(0.814 0.137 68)
- OKLab
- oklab(0.814 0.051 0.127)
- CIE Lab
- lab(78.09 22.57 55.95)
- LCH
- lch(78.09 60.34 68)
- CMYK
- cmyk(0% 30% 65% 1%)
درجات فاتحة · درجات داكنة · درجات رمادية
درجات فاتحة
- FDB86B
- FEC17E
- FEC98F
- FFD1A0
- FFD8B0
- FFE0C0
- FFE8D0
- FFF0E0
- FFF7EF
درجات داكنة
- DB994B
- BB823E
- 9C6C33
- 7E5627
- 62421C
- 472E12
- 2D1C08
- 160B03
- 030100
درجات رمادية
- EFAB5E
- E3A764
- D6A26A
- CA9E6E
- BD9972
- B19476
- A58F79
- 988A7C
- 8C857E
تناسق الألوان
متمم +180°
- FCB057
Duckling
- 8EC8FF
≈ Clear Sky
متجاور -30° +30°
- FCB057
Duckling
- FFA98F
≈ Frozen Salmon
- DAC24E
≈ Pepperoncini
ثلاثي +120° +240°
- FCB057
Duckling
- 22DED2
≈ Mint Morning
- D8ACFF
≈ Testosterose
متمم منقسم +150° +210°
- FCB057
Duckling
- 31D7FD
≈ Neon Blue
- B3BDFF
≈ Dried Lilac
رباعي +90° +180° +270°
التباين وإمكانية الوصول
Ag
Failعلى الأبيض
WCAG 1.82:1 · APCA Lc 34
Ag
AAAعلى الأسود
WCAG 11.48:1 · APCA Lc 69
أفضل لون للنص: #000000
WCAG 11.48:1 (AAA) · APCA Lc 69
Contrast pairs
مقتطفات الأكواد
CSS
:root {
--duckling: #fcb057;
--duckling-rgb: 252 176 87;
--duckling-oklch: oklch(0.814 0.137 68);
}
.element {
color: var(--duckling);
background-color: hsl(32 96% 66%);
border-color: oklch(0.814 0.137 68);
}Tailwind CSS v4
@theme {
--color-duckling: #fcb057;
--color-duckling-50: #ffefcb;
--color-duckling-100: #ffe1b7;
--color-duckling-200: #faca94;
--color-duckling-300: #e4ab66;
--color-duckling-400: #d38d37;
--color-duckling-500: #c07100;
--color-duckling-600: #a26000;
--color-duckling-700: #824d00;
--color-duckling-800: #613700;
--color-duckling-900: #442500;
--color-duckling-950: #2c1300;
}SCSS
$duckling: #fcb057;
$duckling-rgb: 252, 176, 87;
$duckling-light: mix(#fff, $duckling, 20%);
$duckling-dark: mix(#000, $duckling, 20%);
.element {
color: $duckling;
box-shadow: 0 0 0 2px rgba($duckling, 0.35);
}