最接近的命名颜色 · #0F8DF5
#0F8DF5
最接近的命名颜色: Too Blue to Be True
#0F8DF5(rgb(15 141 245)、hsl(207 92% 51%)、oklch(0.637 0.183 251.4))最接近命名颜色 Too Blue to Be True。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度,以及 CSS、Tailwind v4 和 SCSS 代码。
#0F8DF5
oklch(0.637 0.183 251.4)
颜色转换
- HEX
- #0f8df5
- RGB
- rgb(15 141 245)
- HSL
- hsl(207 92% 51%)
- HWB
- hwb(207 6% 4%)
- OKLCH
- oklch(0.637 0.183 251.4)
- OKLab
- oklab(0.637 -0.058 -0.173)
- CIE Lab
- lab(56.82 -1.42 -61.78)
- LCH
- lch(56.82 61.79 268.7)
- CMYK
- cmyk(94% 42% 0% 4%)
浅色调 · 深色调 · 灰色调
浅色调
- 3A99F7
- 55A5F9
- 6CB1FB
- 82BDFC
- 98C8FE
- ADD3FF
- C1DEFF
- D6E9FF
- EAF4FF
深色调
- 0B7AD5
- 0867B6
- 055598
- 03447B
- 02335F
- 012344
- 00142B
- 000715
- 000103
灰色调
- 2B8DE9
- 3B8CDE
- 478BD2
- 528AC7
- 5B89BB
- 6488B0
- 6B86A4
- 738498
- 7A828C
配色和谐
互补色 +180°
- 0F8DF5
Too Blue to Be True
- BE7B00
≈ Guo Tie Dumpling
类似色 -30° +30°
- 0F8DF5
Too Blue to Be True
- 009BBD
≈ Sea Wonder
- 7C78F6
≈ Hera Blue
三角配色 +120° +240°
- 0F8DF5
Too Blue to Be True
- E3506F
≈ Camellia Rose
- 639F00
≈ Gecko’s Dream
分裂互补色 +150° +210°
- 0F8DF5
Too Blue to Be True
- E25A1A
≈ Ferocious Fox
- 9D8D00
≈ Guava Green
四角配色 +90° +180° +270°
- 0F8DF5
Too Blue to Be True
- D155AB
≈ Pú Táo Zǐ Purple
- BE7B00
≈ Guo Tie Dumpling
- 00A56F
≈ Bluish Green
对比度与无障碍
Ag
Fail白底
WCAG 3.41:1 · APCA Lc 61
Ag
AA黑底
WCAG 6.14:1 · APCA Lc 41
最佳文字颜色: #000000
WCAG 6.14:1 (AA) · APCA Lc 41
Contrast pairs
代码片段
CSS
:root {
--too-blue-to-be-true: #0f8df5;
--too-blue-to-be-true-rgb: 15 141 245;
--too-blue-to-be-true-oklch: oklch(0.637 0.183 251.4);
}
.element {
color: var(--too-blue-to-be-true);
background-color: hsl(207 92% 51%);
border-color: oklch(0.637 0.183 251.4);
}Tailwind CSS v4
@theme {
--color-too-blue-to-be-true: #0f8df5;
--color-too-blue-to-be-true-50: #d1f9ff;
--color-too-blue-to-be-true-100: #bdecff;
--color-too-blue-to-be-true-200: #9cd9ff;
--color-too-blue-to-be-true-300: #70bbff;
--color-too-blue-to-be-true-400: #3ba2ff;
--color-too-blue-to-be-true-500: #0086f9;
--color-too-blue-to-be-true-600: #0072d2;
--color-too-blue-to-be-true-700: #005ba9;
--color-too-blue-to-be-true-800: #00437e;
--color-too-blue-to-be-true-900: #002f59;
--color-too-blue-to-be-true-950: #001b3c;
}SCSS
$too-blue-to-be-true: #0f8df5;
$too-blue-to-be-true-rgb: 15, 141, 245;
$too-blue-to-be-true-light: mix(#fff, $too-blue-to-be-true, 20%);
$too-blue-to-be-true-dark: mix(#000, $too-blue-to-be-true, 20%);
.element {
color: $too-blue-to-be-true;
box-shadow: 0 0 0 2px rgba($too-blue-to-be-true, 0.35);
}