最接近的命名颜色 · #76ACFF
#76ACFF
最接近的命名颜色: Fennel Flower
#76ACFF(rgb(118 172 255)、hsl(216 100% 73%)、oklch(0.742 0.134 258.7))最接近命名颜色 Fennel Flower。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度,以及 CSS、Tailwind v4 和 SCSS 代码。
#76ACFF
oklch(0.742 0.134 258.7)
颜色转换
- HEX
- #76acff
- RGB
- rgb(118 172 255)
- HSL
- hsl(216 100% 73%)
- HWB
- hwb(216 46% 0%)
- OKLCH
- oklch(0.742 0.134 258.7)
- OKLab
- oklab(0.742 -0.026 -0.131)
- CIE Lab
- lab(69.23 -0.49 -47.36)
- LCH
- lch(69.23 47.36 269.4)
- CMYK
- cmyk(54% 33% 0% 0%)
浅色调 · 深色调 · 灰色调
浅色调
- 84B5FF
- 91BDFF
- 9FC6FF
- ADCEFF
- BAD6FF
- C8DFFF
- D6E7FF
- E3EFFF
- F1F7FF
深色调
- 6695DE
- 567FBE
- 47699E
- 385480
- 294063
- 1C2D48
- 0F1B2E
- 050B16
- 010103
灰色调
- 78A8F2
- 79A4E5
- 7AA0D8
- 7C9BCC
- 7D97BF
- 7E92B2
- 7E8EA6
- 7F8999
- 80858D
配色和谐
互补色 +180°
- 76ACFF
Fennel Flower
- D9A038
≈ Courgette Yellow
类似色 -30° +30°
- 76ACFF
Fennel Flower
- 31BBEE
≈ Blue Bikini
- A99CFA
≈ Cobalite
三角配色 +120° +240°
- 76ACFF
Fennel Flower
- F4868A
≈ Flamingo Dream
- 7EBF6B
≈ Hillside Grove
分裂互补色 +150° +210°
- 76ACFF
Fennel Flower
- EF905B
≈ Chinese Lantern
- B3B240
≈ Friendly Frog
四角配色 +90° +180° +270°
- 76ACFF
Fennel Flower
- E986B9
≈ Tempting Pink
- D9A038
≈ Courgette Yellow
- 38C69C
≈ Jadeite
对比度与无障碍
Ag
Fail白底
WCAG 2.30:1 · APCA Lc 45
Ag
AAA黑底
WCAG 9.11:1 · APCA Lc 57
最佳文字颜色: #000000
WCAG 9.11:1 (AAA) · APCA Lc 57
Contrast pairs
代码片段
CSS
:root {
--fennel-flower: #76acff;
--fennel-flower-rgb: 118 172 255;
--fennel-flower-oklch: oklch(0.742 0.134 258.7);
}
.element {
color: var(--fennel-flower);
background-color: hsl(216 100% 73%);
border-color: oklch(0.742 0.134 258.7);
}Tailwind CSS v4
@theme {
--color-fennel-flower: #76acff;
--color-fennel-flower-50: #e0f6ff;
--color-fennel-flower-100: #cfe9ff;
--color-fennel-flower-200: #b4d6ff;
--color-fennel-flower-300: #90b8fc;
--color-fennel-flower-400: #6c9fed;
--color-fennel-flower-500: #4b85dd;
--color-fennel-flower-600: #4171bb;
--color-fennel-flower-700: #335a96;
--color-fennel-flower-800: #214270;
--color-fennel-flower-900: #162e4f;
--color-fennel-flower-950: #071a34;
}SCSS
$fennel-flower: #76acff;
$fennel-flower-rgb: 118, 172, 255;
$fennel-flower-light: mix(#fff, $fennel-flower, 20%);
$fennel-flower-dark: mix(#000, $fennel-flower, 20%);
.element {
color: $fennel-flower;
box-shadow: 0 0 0 2px rgba($fennel-flower, 0.35);
}