最接近的命名颜色 · #C5C5DE
#C5C5DE
最接近的命名颜色: Foggy Plateau
#C5C5DE（rgb(197 197 222)、hsl(240 27% 82%)、oklch(0.831 0.035 285.6)）最接近命名颜色 Foggy Plateau。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。
#C5C5DE
oklch(0.831 0.035 285.6)
颜色转换
- HEX
- #c5c5de
- RGB
- rgb(197 197 222)
- HSL
- hsl(240 27% 82%)
- HWB
- hwb(240 77% 13%)
- OKLCH
- oklch(0.831 0.035 285.6)
- OKLab
- oklab(0.831 0.009 -0.033)
- CIE Lab
- lab(80.11 3.64 -12.49)
- LCH
- lch(80.11 13.01 286.2)
- CMYK
- cmyk(11% 11% 0% 13%)
浅色调 · 深色调 · 灰色调
浅色调
- CBCBE1
- D0D0E5
- D6D6E8
- DCDCEB
- E2E2EF
- E7E8F2
- EDEDF5
- F3F3F8
- F9F9FC
深色调
- ABABC1
- 9292A5
- 797989
- 61616F
- 4B4B55
- 35353D
- 212126
- 0E0E12
- 020202
灰色调
- BEBED4
- B7B7CB
- B0B0C1
- A9A9B7
- A2A2AE
- 9B9BA5
- 94949B
- 8D8D92
- 878789
配色和谐
互补色 +180°
- C5C5DE
Foggy Plateau
- CACAB0
≈ Cilantro Cream
类似色 -30° +30°
- C5C5DE
Foggy Plateau
- B9C9DF
≈ Mystic River
- D1C1D7
≈ Tender Violet
三角配色 +120° +240°
- C5C5DE
Foggy Plateau
- DCC1B5
≈ Marshmallow Cocoa
- B4CFC2
≈ Watershed
分裂互补色 +150° +210°
- C5C5DE
Foggy Plateau
- D5C5AF
≈ Casual Khaki
- BECDB7
≈ Isle of Dreams
四角配色 +90° +180° +270°
- C5C5DE
Foggy Plateau
- DEBFC0
≈ Mud Pink
- CACAB0
≈ Cilantro Cream
- AFCFCF
≈ Turquoise Grey
对比度与无障碍
Ag
Fail白底
WCAG 1.69:1 · APCA Lc 30
Ag
AAA黑底
WCAG 12.41:1 · APCA Lc 73
最佳文字颜色: #000000
WCAG 12.41:1 (AAA) · APCA Lc 73
Contrast pairs
代码片段
CSS
:root {
--foggy-plateau: #c5c5de;
--foggy-plateau-rgb: 197 197 222;
--foggy-plateau-oklch: oklch(0.831 0.035 285.6);
}
.element {
color: var(--foggy-plateau);
background-color: hsl(240 27% 82%);
border-color: oklch(0.831 0.035 285.6);
}Tailwind CSS v4
@theme {
--color-foggy-plateau: #c5c5de;
--color-foggy-plateau-50: #f4f4ff;
--color-foggy-plateau-100: #e7e6f3;
--color-foggy-plateau-200: #d3d2e3;
--color-foggy-plateau-300: #b6b5c9;
--color-foggy-plateau-400: #9c9cb3;
--color-foggy-plateau-500: #83839d;
--color-foggy-plateau-600: #6f6f85;
--color-foggy-plateau-700: #59596a;
--color-foggy-plateau-800: #40414e;
--color-foggy-plateau-900: #2c2d36;
--color-foggy-plateau-950: #1a1a21;
}SCSS
$foggy-plateau: #c5c5de;
$foggy-plateau-rgb: 197, 197, 222;
$foggy-plateau-light: mix(#fff, $foggy-plateau, 20%);
$foggy-plateau-dark: mix(#000, $foggy-plateau, 20%);
.element {
color: $foggy-plateau;
box-shadow: 0 0 0 2px rgba($foggy-plateau, 0.35);
}