命名颜色 · #45868B
Sea Caller
Sea Caller 即 #45868B：rgb(69 134 139)、hsl(184 34% 41%)、oklch(0.579 0.067 202.1)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。
What does Cyan mean? → · Sea Caller color name →
#45868B
oklch(0.579 0.067 202.1)
颜色转换
- HEX
- #45868b
- RGB
- rgb(69 134 139)
- HSL
- hsl(184 34% 41%)
- HWB
- hwb(184 27% 45%)
- OKLCH
- oklch(0.579 0.067 202.1)
- OKLab
- oklab(0.579 -0.062 -0.025)
- CIE Lab
- lab(51.81 -20.61 -9.49)
- LCH
- lch(51.81 22.69 204.7)
- CMYK
- cmyk(50% 4% 0% 45%)
浅色调 · 深色调 · 灰色调
浅色调
- 599296
- 6B9DA1
- 7EA9AD
- 90B5B8
- A2C1C4
- B5CDCF
- C7DADB
- DAE6E7
- ECF2F3
深色调
- 3B7478
- 316266
- 275154
- 1E4043
- 153032
- 0C2123
- 051314
- 020607
- 000101
灰色调
- 4D868A
- 548589
- 5A8588
- 608487
- 668386
- 6C8384
- 718283
- 768182
- 7B8181
配色和谐
互补色 +180°
- 45868B
Sea Caller
- 9E6A68
≈ Withered Rose
类似色 -30° +30°
- 45868B
Sea Caller
- 4E8776
≈ Think Leaf
- 4F819B
≈ Flattering Blue
三角配色 +120° +240°
- 45868B
Sea Caller
- 8D6D92
≈ Rhinestone
- 8E764B
≈ September Gold
分裂互补色 +150° +210°
- 45868B
Sea Caller
- 996A7E
≈ Arcane
- 9A6F55
≈ Freckle Face
四角配色 +90° +180° +270°
- 45868B
Sea Caller
- 7B739F
≈ Queen’s
- 9E6A68
≈ Withered Rose
- 7B7E4F
≈ Calliste Green
对比度与无障碍
Ag
Fail白底
WCAG 4.17:1 · APCA Lc 69
Ag
AA黑底
WCAG 5.03:1 · APCA Lc 33
最佳文字颜色: #000000
WCAG 5.03:1 (AA) · APCA Lc 33
Contrast pairs
代码片段
CSS
:root {
--sea-caller: #45868b;
--sea-caller-rgb: 69 134 139;
--sea-caller-oklch: oklch(0.579 0.067 202.1);
}
.element {
color: var(--sea-caller);
background-color: hsl(184 34% 41%);
border-color: oklch(0.579 0.067 202.1);
}Tailwind CSS v4
@theme {
--color-sea-caller: #45868b;
--color-sea-caller-50: #e0fbfe;
--color-sea-caller-100: #cfeff2;
--color-sea-caller-200: #b4dde1;
--color-sea-caller-300: #8fc2c7;
--color-sea-caller-400: #6dabaf;
--color-sea-caller-500: #4a9399;
--color-sea-caller-600: #407d81;
--color-sea-caller-700: #336468;
--color-sea-caller-800: #23494b;
--color-sea-caller-900: #183334;
--color-sea-caller-950: #081f20;
}SCSS
$sea-caller: #45868b;
$sea-caller-rgb: 69, 134, 139;
$sea-caller-light: mix(#fff, $sea-caller, 20%);
$sea-caller-dark: mix(#000, $sea-caller, 20%);
.element {
color: $sea-caller;
box-shadow: 0 0 0 2px rgba($sea-caller, 0.35);
}