最接近的命名颜色 · #46AD75
#46AD75
最接近的命名颜色: Jubilant Jade
#46AD75(rgb(70 173 117)、hsl(147 42% 48%)、oklch(0.672 0.127 156.5))最接近命名颜色 Jubilant Jade。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度,以及 CSS、Tailwind v4 和 SCSS 代码。
#46AD75
oklch(0.672 0.127 156.5)
颜色转换
- HEX
- #46ad75
- RGB
- rgb(70 173 117)
- HSL
- hsl(147 42% 48%)
- HWB
- hwb(147 27% 32%)
- OKLCH
- oklch(0.672 0.127 156.5)
- OKLab
- oklab(0.672 -0.117 0.051)
- CIE Lab
- lab(63.67 -41.11 19.6)
- LCH
- lch(63.67 45.55 154.5)
- CMYK
- cmyk(60% 0% 32% 32%)
浅色调 · 深色调 · 灰色调
浅色调
- 5DB582
- 71BE90
- 84C69D
- 96CEAB
- A8D6B9
- BADFC6
- CBE7D4
- DCEFE2
- EEF7F1
深色调
- 3C9665
- 327F55
- 286A46
- 1E5537
- 154129
- 0D2D1C
- 051B0F
- 020B05
- 000101
灰色调
- 50A976
- 58A478
- 5FA079
- 659B7A
- 6B977B
- 70927C
- 748E7D
- 79897E
- 7C857F
配色和谐
互补色 +180°
- 46AD75
Jubilant Jade
- C776B3
≈ Bishop Red
类似色 -30° +30°
- 46AD75
Jubilant Jade
- 82A447
≈ Greenery
- 00ADA1
≈ Cozumel
三角配色 +120° +240°
- 46AD75
Jubilant Jade
- 828EE3
≈ Perrywinkle
- D8775C
≈ Clay Mug
分裂互补色 +150° +210°
- 46AD75
Jubilant Jade
- AA80D3
≈ Lavender Blossom
- D77289
≈ Strawberry Milkshake
四角配色 +90° +180° +270°
- 46AD75
Jubilant Jade
- 4C9CE0
≈ Flax Flower Blue
- C776B3
≈ Bishop Red
- CA8532
≈ Yam
对比度与无障碍
Ag
Fail白底
WCAG 2.80:1 · APCA Lc 54
Ag
AAA黑底
WCAG 7.49:1 · APCA Lc 48
最佳文字颜色: #000000
WCAG 7.49:1 (AAA) · APCA Lc 48
Contrast pairs
代码片段
CSS
:root {
--jubilant-jade: #46ad75;
--jubilant-jade-rgb: 70 173 117;
--jubilant-jade-oklch: oklch(0.672 0.127 156.5);
}
.element {
color: var(--jubilant-jade);
background-color: hsl(147 42% 48%);
border-color: oklch(0.672 0.127 156.5);
}Tailwind CSS v4
@theme {
--color-jubilant-jade: #46ad75;
--color-jubilant-jade-50: #d8ffe8;
--color-jubilant-jade-100: #c5f6d8;
--color-jubilant-jade-200: #a6e5c0;
--color-jubilant-jade-300: #7ccc9f;
--color-jubilant-jade-400: #56b57f;
--color-jubilant-jade-500: #1e9e62;
--color-jubilant-jade-600: #1e8653;
--color-jubilant-jade-700: #196b42;
--color-jubilant-jade-800: #134f2e;
--color-jubilant-jade-900: #0c371f;
--color-jubilant-jade-950: #00220f;
}SCSS
$jubilant-jade: #46ad75;
$jubilant-jade-rgb: 70, 173, 117;
$jubilant-jade-light: mix(#fff, $jubilant-jade, 20%);
$jubilant-jade-dark: mix(#000, $jubilant-jade, 20%);
.element {
color: $jubilant-jade;
box-shadow: 0 0 0 2px rgba($jubilant-jade, 0.35);
}