命名颜色 · #FFE989
Quack Quack
Quack Quack 即 #FFE989：rgb(255 233 137)、hsl(49 100% 77%)、oklch(0.932 0.119 96.8)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。
What does Yellow mean? → · Quack Quack color name →
#FFE989
oklch(0.932 0.119 96.8)
颜色转换
- HEX
- #ffe989
- RGB
- rgb(255 233 137)
- HSL
- hsl(49 100% 77%)
- HWB
- hwb(49 54% 0%)
- OKLCH
- oklch(0.932 0.119 96.8)
- OKLab
- oklab(0.932 -0.014 0.118)
- CIE Lab
- lab(92.65 -1.34 49.23)
- LCH
- lch(92.65 49.25 91.6)
- CMYK
- cmyk(0% 9% 46% 0%)
浅色调 · 深色调 · 灰色调
浅色调
- FFEB96
- FFEEA3
- FFF0B0
- FFF2BC
- FFF5C7
- FFF7D3
- FFF9DE
- FFFBE9
- FFFDF4
深色调
- DECB76
- BEAD64
- 9E9053
- 807442
- 635A31
- 484122
- 2E2914
- 161307
- 030301
灰色调
- F2DE8A
- E4D38A
- D7C98A
- CABE89
- BDB488
- B1A987
- A49F86
- 989484
- 8C8A82
配色和谐
互补色 +180°
- FFE989
Quack Quack
- E2E7FF
≈ Lavender Mist
类似色 -30° +30°
- FFE989
Quack Quack
- FFE3C7
≈ Wild Maple
- D3F8A0
≈ Creamy Avocado
三角配色 +120° +240°
- FFE989
Quack Quack
- C3F2FF
≈ Heaven’s Gate
- FFDDF5
≈ Silky Pink
分裂互补色 +150° +210°
- FFE989
Quack Quack
- D7EBFF
≈ Cloudless
- F0E2FF
≈ Lavender Savour
四角配色 +90° +180° +270°
- FFE989
Quack Quack
- 93FFF4
≈ Hello Winter
- E2E7FF
≈ Lavender Mist
- FFDFE4
≈ Pink Pleasure
对比度与无障碍
Ag
Fail白底
WCAG 1.21:1 · APCA Lc 11
Ag
AAA黑底
WCAG 17.26:1 · APCA Lc 94
最佳文字颜色: #000000
WCAG 17.26:1 (AAA) · APCA Lc 94
Contrast pairs
代码片段
CSS
:root {
--quack-quack: #ffe989;
--quack-quack-rgb: 255 233 137;
--quack-quack-oklch: oklch(0.932 0.119 96.8);
}
.element {
color: var(--quack-quack);
background-color: hsl(49 100% 77%);
border-color: oklch(0.932 0.119 96.8);
}Tailwind CSS v4
@theme {
--color-quack-quack: #ffe989;
--color-quack-quack-50: #fdf6d0;
--color-quack-quack-100: #f2e9bc;
--color-quack-quack-200: #e1d69b;
--color-quack-quack-300: #c7b96f;
--color-quack-quack-400: #b29e43;
--color-quack-quack-500: #9d8500;
--color-quack-quack-600: #857101;
--color-quack-quack-700: #6a5a04;
--color-quack-quack-800: #4f4101;
--color-quack-quack-900: #372d02;
--color-quack-quack-950: #221a00;
}SCSS
$quack-quack: #ffe989;
$quack-quack-rgb: 255, 233, 137;
$quack-quack-light: mix(#fff, $quack-quack, 20%);
$quack-quack-dark: mix(#000, $quack-quack, 20%);
.element {
color: $quack-quack;
box-shadow: 0 0 0 2px rgba($quack-quack, 0.35);
}