最接近的命名颜色 · #FFA6F3
#FFA6F3
最接近的命名颜色: Jigglypuff
#FFA6F3(rgb(255 166 243)、hsl(308 100% 83%)、oklch(0.837 0.142 331.7))最接近命名颜色 Jigglypuff。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度,以及 CSS、Tailwind v4 和 SCSS 代码。
#FFA6F3
oklch(0.837 0.142 331.7)
颜色转换
- HEX
- #ffa6f3
- RGB
- rgb(255 166 243)
- HSL
- hsl(308 100% 83%)
- HWB
- hwb(308 65% 0%)
- OKLCH
- oklch(0.837 0.142 331.7)
- OKLab
- oklab(0.837 0.125 -0.067)
- CIE Lab
- lab(79.05 42.03 -24.63)
- LCH
- lch(79.05 48.72 329.6)
- CMYK
- cmyk(0% 35% 5% 0%)
浅色调 · 深色调 · 灰色调
浅色调
- FFAFF4
- FFB9F6
- FFC2F7
- FFCBF8
- FFD3FA
- FFDCFB
- FFE5FC
- FFEEFD
- FFF6FE
深色调
- DE90D3
- BE7AB4
- 9E6597
- 80517A
- 633E5E
- 482B44
- 2E1A2B
- 160A14
- 030103
灰色调
- F2A3E7
- E59FDB
- D89CCF
- CC98C4
- BF94B8
- B290AD
- A68CA1
- 998896
- 8D848B
配色和谐
互补色 +180°
- FFA6F3
Jigglypuff
- 7CE49A
≈ Ragweed
类似色 -30° +30°
- FFA6F3
Jigglypuff
- D5BBFF
≈ Pink Illusion
- FFAFC5
≈ Baby’s Blanket
三角配色 +120° +240°
- FFA6F3
Jigglypuff
- EBC64E
≈ Yellow Brick Road
- 1FE1FF
≈ Vaporwave Blue
分裂互补色 +150° +210°
- FFA6F3
Jigglypuff
- BBD869
≈ Melissa
- 31E7D0
≈ MoS₂ Cyan
四角配色 +90° +180° +270°
对比度与无障碍
Ag
Fail白底
WCAG 1.74:1 · APCA Lc 32
Ag
AAA黑底
WCAG 12.00:1 · APCA Lc 71
最佳文字颜色: #000000
WCAG 12.00:1 (AAA) · APCA Lc 71
Contrast pairs
代码片段
CSS
:root {
--jigglypuff: #ffa6f3;
--jigglypuff-rgb: 255 166 243;
--jigglypuff-oklch: oklch(0.837 0.142 331.7);
}
.element {
color: var(--jigglypuff);
background-color: hsl(308 100% 83%);
border-color: oklch(0.837 0.142 331.7);
}Tailwind CSS v4
@theme {
--color-jigglypuff: #ffa6f3;
--color-jigglypuff-50: #ffe7ff;
--color-jigglypuff-100: #ffd7fc;
--color-jigglypuff-200: #fabeee;
--color-jigglypuff-300: #e49cd6;
--color-jigglypuff-400: #ce7dc4;
--color-jigglypuff-500: #ba5eb0;
--color-jigglypuff-600: #9d5095;
--color-jigglypuff-700: #7e4077;
--color-jigglypuff-800: #5d2e5a;
--color-jigglypuff-900: #411f3f;
--color-jigglypuff-950: #290e28;
}SCSS
$jigglypuff: #ffa6f3;
$jigglypuff-rgb: 255, 166, 243;
$jigglypuff-light: mix(#fff, $jigglypuff, 20%);
$jigglypuff-dark: mix(#000, $jigglypuff, 20%);
.element {
color: $jigglypuff;
box-shadow: 0 0 0 2px rgba($jigglypuff, 0.35);
}