命名颜色 · #FFEC47
Rapeseed Blossom
Rapeseed Blossom 即 #FFEC47：rgb(255 236 71)、hsl(54 100% 64%)、oklch(0.931 0.175 102.6)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。
What does Yellow mean? → · Rapeseed Blossom color name →
#FFEC47
oklch(0.931 0.175 102.6)
颜色转换
- HEX
- #ffec47
- RGB
- rgb(255 236 71)
- HSL
- hsl(54 100% 64%)
- HWB
- hwb(54 28% 0%)
- OKLCH
- oklch(0.931 0.175 102.6)
- OKLab
- oklab(0.931 -0.038 0.171)
- CIE Lab
- lab(92.91 -5.95 76.96)
- LCH
- lch(92.91 77.19 94.4)
- CMYK
- cmyk(0% 7% 72% 0%)
浅色调 · 深色调 · 灰色调
浅色调
- FFEE64
- FFF17B
- FFF38F
- FEF5A1
- FEF7B2
- FEF9C2
- FFFAD2
- FFFCE1
- FFFEF0
深色调
- DECD3D
- BEAF32
- 9E9228
- 80761F
- 635B16
- 48420D
- 2E2906
- 161302
- 030300
灰色调
- F1E155
- E4D65F
- D7CB67
- CAC06E
- BDB573
- B0AB77
- A4A07A
- 98957D
- 8C8B7F
配色和谐
互补色 +180°
- FFEC47
Rapeseed Blossom
- E4E6FF
≈ Lavender Mist
类似色 -30° +30°
- FFEC47
Rapeseed Blossom
- FFE3C2
≈ Bisque
- BEFF8A
≈ Light Yellowish Green
三角配色 +120° +240°
- FFEC47
Rapeseed Blossom
- C8F0FF
≈ Heaven’s Gate
- FFDDF0
≈ Transparent Pink
分裂互补色 +150° +210°
- FFEC47
Rapeseed Blossom
- D9EAFF
≈ Cloudless
- F3E0FF
≈ Lavender Savour
四角配色 +90° +180° +270°
- FFEC47
Rapeseed Blossom
- 8CFFFB
≈ Glitter Shower
- E4E6FF
≈ Lavender Mist
- FFDFE2
≈ Sweet Mallow
对比度与无障碍
Ag
Fail白底
WCAG 1.21:1 · APCA Lc 10
Ag
AAA黑底
WCAG 17.34:1 · APCA Lc 94
最佳文字颜色: #000000
WCAG 17.34:1 (AAA) · APCA Lc 94
Contrast pairs
代码片段
CSS
:root {
--rapeseed-blossom: #ffec47;
--rapeseed-blossom-rgb: 255 236 71;
--rapeseed-blossom-oklch: oklch(0.931 0.175 102.6);
}
.element {
color: var(--rapeseed-blossom);
background-color: hsl(54 100% 64%);
border-color: oklch(0.931 0.175 102.6);
}Tailwind CSS v4
@theme {
--color-rapeseed-blossom: #ffec47;
--color-rapeseed-blossom-50: #fcf9bf;
--color-rapeseed-blossom-100: #f1eca7;
--color-rapeseed-blossom-200: #e0d97d;
--color-rapeseed-blossom-300: #c6bc42;
--color-rapeseed-blossom-400: #b3a100;
--color-rapeseed-blossom-500: #9e8700;
--color-rapeseed-blossom-600: #857200;
--color-rapeseed-blossom-700: #6b5b00;
--color-rapeseed-blossom-800: #514200;
--color-rapeseed-blossom-900: #382e00;
--color-rapeseed-blossom-950: #231a00;
}SCSS
$rapeseed-blossom: #ffec47;
$rapeseed-blossom-rgb: 255, 236, 71;
$rapeseed-blossom-light: mix(#fff, $rapeseed-blossom, 20%);
$rapeseed-blossom-dark: mix(#000, $rapeseed-blossom, 20%);
.element {
color: $rapeseed-blossom;
box-shadow: 0 0 0 2px rgba($rapeseed-blossom, 0.35);
}