命名颜色 · #9FBBDA
Baltic Bream
Baltic Bream 即 #9FBBDA：rgb(159 187 218)、hsl(212 44% 74%)、oklch(0.782 0.054 251.1)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。
What does Blue mean? → · Baltic Bream color name →
#9FBBDA
oklch(0.782 0.054 251.1)
颜色转换
- HEX
- #9fbbda
- RGB
- rgb(159 187 218)
- HSL
- hsl(212 44% 74%)
- HWB
- hwb(212 62% 15%)
- OKLCH
- oklch(0.782 0.054 251.1)
- OKLab
- oklab(0.782 -0.017 -0.051)
- CIE Lab
- lab(74.56 -4.59 -18.96)
- LCH
- lch(74.56 19.5 256.4)
- CMYK
- cmyk(27% 14% 0% 15%)
浅色调 · 深色调 · 灰色调
浅色调
- A8C2DE
- B2C8E2
- BBCFE5
- C5D6E9
- CEDDED
- D8E4F0
- E2EAF4
- EBF1F8
- F5F8FB
深色调
- 8AA2BD
- 758AA2
- 617387
- 4D5C6C
- 3B4654
- 29323C
- 181F25
- 090D11
- 010202
灰色调
- 9CB5D1
- 99AFC7
- 96A9BE
- 93A3B5
- 909DAC
- 8D97A3
- 89919A
- 868C91
- 838689
配色和谐
互补色 +180°
- 9FBBDA
Baltic Bream
- CEB393
≈ Moraine
类似色 -30° +30°
- 9FBBDA
Baltic Bream
- 92C0D0
≈ Eastern Sky
- B1B5DA
≈ Wild Orchid Blue
三角配色 +120° +240°
- 9FBBDA
Baltic Bream
- D8AAAF
≈ Pale Persimmon
- ACC09C
≈ Saxon
分裂互补色 +150° +210°
- 9FBBDA
Baltic Bream
- D7AD9E
≈ Montezuma’s Castle
- BFBA92
≈ Salty Seeds
四角配色 +90° +180° +270°
- 9FBBDA
Baltic Bream
- D1ABC2
≈ Heart to Heart
- CEB393
≈ Moraine
- 9AC3AD
≈ Bella Green
对比度与无障碍
Ag
Fail白底
WCAG 1.98:1 · APCA Lc 38
Ag
AAA黑底
WCAG 10.59:1 · APCA Lc 64
最佳文字颜色: #000000
WCAG 10.59:1 (AAA) · APCA Lc 64
Contrast pairs
代码片段
CSS
:root {
--baltic-bream: #9fbbda;
--baltic-bream-rgb: 159 187 218;
--baltic-bream-oklch: oklch(0.782 0.054 251.1);
}
.element {
color: var(--baltic-bream);
background-color: hsl(212 44% 74%);
border-color: oklch(0.782 0.054 251.1);
}Tailwind CSS v4
@theme {
--color-baltic-bream: #9fbbda;
--color-baltic-bream-50: #ebf6ff;
--color-baltic-bream-100: #dce9fa;
--color-baltic-bream-200: #c5d6eb;
--color-baltic-bream-300: #a4bad3;
--color-baltic-bream-400: #87a1be;
--color-baltic-bream-500: #6c89a9;
--color-baltic-bream-600: #5b748f;
--color-baltic-bream-700: #495d73;
--color-baltic-bream-800: #344455;
--color-baltic-bream-900: #232f3b;
--color-baltic-bream-950: #121c25;
}SCSS
$baltic-bream: #9fbbda;
$baltic-bream-rgb: 159, 187, 218;
$baltic-bream-light: mix(#fff, $baltic-bream, 20%);
$baltic-bream-dark: mix(#000, $baltic-bream, 20%);
.element {
color: $baltic-bream;
box-shadow: 0 0 0 2px rgba($baltic-bream, 0.35);
}