命名颜色 · #DCDD65
Succulent Lime
Succulent Lime 即 #DCDD65：rgb(220 221 101)、hsl(61 64% 63%)、oklch(0.873 0.143 109.5)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。
What does Yellow mean? → · Succulent Lime color name →
#DCDD65
oklch(0.873 0.143 109.5)
颜色转换
- HEX
- #dcdd65
- RGB
- rgb(220 221 101)
- HSL
- hsl(61 64% 63%)
- HWB
- hwb(61 40% 13%)
- OKLCH
- oklch(0.873 0.143 109.5)
- OKLab
- oklab(0.873 -0.047 0.134)
- CIE Lab
- lab(86.28 -11.83 57.51)
- LCH
- lch(86.28 58.71 101.6)
- CMYK
- cmyk(0% 0% 54% 13%)
浅色调 · 深色调 · 灰色调
浅色调
- DFE178
- E3E489
- E6E899
- E9EBA9
- EDEFB8
- F0F2C6
- F4F5D5
- F8F9E3
- FBFCF1
深色调
- BFC057
- A3A449
- 88883C
- 6E6E2F
- 545522
- 3C3D17
- 26260C
- 111103
- 020200
灰色调
- D2D46B
- C9CA6F
- BFC173
- B6B777
- ACAE79
- A3A57C
- 9A9C7D
- 91927F
- 89897F
配色和谐
互补色 +180°
- DCDD65
Succulent Lime
- D4CFFF
≈ Pale Lavender
类似色 -30° +30°
- DCDD65
Succulent Lime
- FFCC76
≈ Cheesus
- A3EC90
≈ Ulva Lactuca Green
三角配色 +120° +240°
- DCDD65
Succulent Lime
- 9FE0FF
≈ Columbia Blue
- FFC0DD
≈ Cotton Candy
分裂互补色 +150° +210°
- DCDD65
Succulent Lime
- BDD7FF
≈ Oh Boy!
- F2C0FF
≈ Electric Lavender
四角配色 +90° +180° +270°
- DCDD65
Succulent Lime
- 2CF1F9
≈ Lightsaber Blue
- D4CFFF
≈ Pale Lavender
- FFC4C3
≈ Cinderella Pink
对比度与无障碍
Ag
Fail白底
WCAG 1.44:1 · APCA Lc 21
Ag
AAA黑底
WCAG 14.57:1 · APCA Lc 82
最佳文字颜色: #000000
WCAG 14.57:1 (AAA) · APCA Lc 82
Contrast pairs
代码片段
CSS
:root {
--succulent-lime: #dcdd65;
--succulent-lime-rgb: 220 221 101;
--succulent-lime-oklch: oklch(0.873 0.143 109.5);
}
.element {
color: var(--succulent-lime);
background-color: hsl(61 64% 63%);
border-color: oklch(0.873 0.143 109.5);
}Tailwind CSS v4
@theme {
--color-succulent-lime: #dcdd65;
--color-succulent-lime-50: #f6facb;
--color-succulent-lime-100: #e9edb6;
--color-succulent-lime-200: #d6db93;
--color-succulent-lime-300: #babf65;
--color-succulent-lime-400: #a5a52f;
--color-succulent-lime-500: #8e8c00;
--color-succulent-lime-600: #787700;
--color-succulent-lime-700: #605f00;
--color-succulent-lime-800: #484500;
--color-succulent-lime-900: #323000;
--color-succulent-lime-950: #1e1c00;
}SCSS
$succulent-lime: #dcdd65;
$succulent-lime-rgb: 220, 221, 101;
$succulent-lime-light: mix(#fff, $succulent-lime, 20%);
$succulent-lime-dark: mix(#000, $succulent-lime, 20%);
.element {
color: $succulent-lime;
box-shadow: 0 0 0 2px rgba($succulent-lime, 0.35);
}