最接近的命名颜色 · #00B4FE
#00B4FE
最接近的命名颜色: Hawaii Morning
#00B4FE（rgb(0 180 254)、hsl(197 100% 50%)、oklch(0.729 0.159 237)）最接近命名颜色 Hawaii Morning。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。
#00B4FE
oklch(0.729 0.159 237)
颜色转换
- HEX
- #00b4fe
- RGB
- rgb(0 180 254)
- HSL
- hsl(197 100% 50%)
- HWB
- hwb(197 0% 0%)
- OKLCH
- oklch(0.729 0.159 237)
- OKLab
- oklab(0.729 -0.087 -0.134)
- CIE Lab
- lab(68.55 -19.16 -48.13)
- LCH
- lch(68.55 51.81 248.3)
- CMYK
- cmyk(100% 29% 0% 0%)
浅色调 · 深色调 · 灰色调
浅色调
- 40BCFF
- 5EC4FF
- 76CCFF
- 8CD4FF
- A0DBFF
- B4E3FF
- C7EAFF
- DAF1FF
- EDF8FF
深色调
- 009CDD
- 0085BD
- 006E9E
- 005880
- 004463
- 003047
- 001D2D
- 000C16
- 000203
灰色调
- 2EAFF1
- 41AAE4
- 4FA5D8
- 59A0CB
- 629BBF
- 6A96B2
- 7191A6
- 768B99
- 7B868D
配色和谐
互补色 +180°
- 00B4FE
Hawaii Morning
- F18A2E
≈ Peril’s Flames
类似色 -30° +30°
- 00B4FE
Hawaii Morning
- 00BDCF
≈ Holiday Blue
- 80A3FF
≈ Fennel Flower
三角配色 +120° +240°
- 00B4FE
Hawaii Morning
- F478A9
≈ Erythrosine
- A1B321
≈ Tree Frog
分裂互补色 +150° +210°
- 00B4FE
Hawaii Morning
- FC7B6F
≈ Hipster Salmon
- D0A000
≈ Lepton Gold
四角配色 +90° +180° +270°
- 00B4FE
Hawaii Morning
- DB81DB
≈ Hibiscus Pop
- F18A2E
≈ Peril’s Flames
- 58C269
≈ Emerald Cory
对比度与无障碍
Ag
Fail白底
WCAG 2.34:1 · APCA Lc 45
Ag
AAA黑底
WCAG 8.95:1 · APCA Lc 57
最佳文字颜色: #000000
WCAG 8.95:1 (AAA) · APCA Lc 57
Contrast pairs
代码片段
CSS
:root {
--hawaii-morning: #00b4fe;
--hawaii-morning-rgb: 0 180 254;
--hawaii-morning-oklch: oklch(0.729 0.159 237);
}
.element {
color: var(--hawaii-morning);
background-color: hsl(197 100% 50%);
border-color: oklch(0.729 0.159 237);
}Tailwind CSS v4
@theme {
--color-hawaii-morning: #00b4fe;
--color-hawaii-morning-50: #ccfdff;
--color-hawaii-morning-100: #b7f0ff;
--color-hawaii-morning-200: #92deff;
--color-hawaii-morning-300: #60c2ff;
--color-hawaii-morning-400: #0aaaf0;
--color-hawaii-morning-500: #0091e1;
--color-hawaii-morning-600: #007bbe;
--color-hawaii-morning-700: #006398;
--color-hawaii-morning-800: #004971;
--color-hawaii-morning-900: #00334f;
--color-hawaii-morning-950: #001e35;
}SCSS
$hawaii-morning: #00b4fe;
$hawaii-morning-rgb: 0, 180, 254;
$hawaii-morning-light: mix(#fff, $hawaii-morning, 20%);
$hawaii-morning-dark: mix(#000, $hawaii-morning, 20%);
.element {
color: $hawaii-morning;
box-shadow: 0 0 0 2px rgba($hawaii-morning, 0.35);
}