命名颜色 · #CCCB2F
Lime Pop
Lime Pop 即 #CCCB2F：rgb(204 203 47)、hsl(60 63% 49%)、oklch(0.817 0.165 109.2)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。
What does Yellow mean? → · Lime Pop color name →
#CCCB2F
oklch(0.817 0.165 109.2)
颜色转换
- HEX
- #cccb2f
- RGB
- rgb(204 203 47)
- HSL
- hsl(60 63% 49%)
- HWB
- hwb(60 18% 20%)
- OKLCH
- oklch(0.817 0.165 109.2)
- OKLab
- oklab(0.817 -0.054 0.156)
- CIE Lab
- lab(79.85 -12.17 70.89)
- LCH
- lch(79.85 71.93 99.7)
- CMYK
- cmyk(0% 0% 77% 20%)
浅色调 · 深色调 · 灰色调
浅色调
- D1D150
- D6D669
- DADB7F
- DFE193
- E4E6A6
- EAEBB8
- EFF0CA
- F4F5DC
- FAFAEE
深色调
- B1B027
- 979620
- 7E7D19
- 656512
- 4E4D0C
- 373706
- 222203
- 0F0F01
- 020200
灰色调
- C4C441
- BCBC4E
- B4B559
- ACAD61
- A5A668
- 9D9E6E
- 969774
- 8E8F78
- 87887C
配色和谐
互补色 +180°
- CCCB2F
Lime Pop
- C1B9FF
≈ Dried Lilac
类似色 -30° +30°
- CCCB2F
Lime Pop
- FBB51B
≈ Tropical Sun
- 88DC71
≈ Pastel Green
三角配色 +120° +240°
- CCCB2F
Lime Pop
- 69D1FF
≈ Heisenberg Blue
- FFA1D0
≈ Corinthian Pink
分裂互补色 +150° +210°
- CCCB2F
Lime Pop
- A0C5FF
≈ Pastel Blue
- ECA3FF
≈ Rich Brilliant Lavender
四角配色 +90° +180° +270°
对比度与无障碍
Ag
Fail白底
WCAG 1.72:1 · APCA Lc 31
Ag
AAA黑底
WCAG 12.15:1 · APCA Lc 72
最佳文字颜色: #000000
WCAG 12.15:1 (AAA) · APCA Lc 72
Contrast pairs
代码片段
CSS
:root {
--lime-pop: #cccb2f;
--lime-pop-rgb: 204 203 47;
--lime-pop-oklch: oklch(0.817 0.165 109.2);
}
.element {
color: var(--lime-pop);
background-color: hsl(60 63% 49%);
border-color: oklch(0.817 0.165 109.2);
}Tailwind CSS v4
@theme {
--color-lime-pop: #cccb2f;
--color-lime-pop-50: #f6fac4;
--color-lime-pop-100: #e9eeae;
--color-lime-pop-200: #d7db87;
--color-lime-pop-300: #bbbf52;
--color-lime-pop-400: #a7a500;
--color-lime-pop-500: #908c00;
--color-lime-pop-600: #7a7700;
--color-lime-pop-700: #625f00;
--color-lime-pop-800: #4a4500;
--color-lime-pop-900: #333000;
--color-lime-pop-950: #1f1c00;
}SCSS
$lime-pop: #cccb2f;
$lime-pop-rgb: 204, 203, 47;
$lime-pop-light: mix(#fff, $lime-pop, 20%);
$lime-pop-dark: mix(#000, $lime-pop, 20%);
.element {
color: $lime-pop;
box-shadow: 0 0 0 2px rgba($lime-pop, 0.35);
}