命名颜色 · #B8D4BB
Surf
Surf 即 #B8D4BB：rgb(184 212 187)、hsl(126 25% 78%)、oklch(0.842 0.046 148.2)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。
What does Green mean? → · Surf color name →
#B8D4BB
oklch(0.842 0.046 148.2)
颜色转换
- HEX
- #b8d4bb
- RGB
- rgb(184 212 187)
- HSL
- hsl(126 25% 78%)
- HWB
- hwb(126 72% 17%)
- OKLCH
- oklch(0.842 0.046 148.2)
- OKLab
- oklab(0.842 -0.039 0.024)
- CIE Lab
- lab(82.31 -13.24 9.13)
- LCH
- lch(82.31 16.08 145.4)
- CMYK
- cmyk(13% 0% 12% 17%)
浅色调 · 深色调 · 灰色调
浅色调
- BFD8C2
- C6DDC8
- CDE1CF
- D4E5D6
- DBE9DD
- E2EEE3
- EAF2EA
- F1F6F1
- F8FBF8
深色调
- A0B8A2
- 889D8A
- 718373
- 5B695C
- 455146
- 313A32
- 1E241F
- 0C100D
- 020202
灰色调
- B2CBB5
- ADC3AF
- A7BAA9
- A1B2A3
- 9CA99D
- 96A197
- 919891
- 8B908C
- 868886
配色和谐
互补色 +180°
- B8D4BB
Surf
- DCC1DB
≈ Epiphany
类似色 -30° +30°
- B8D4BB
Surf
- C8D0AF
≈ Bamboo White
- ACD6CB
≈ Scud
三角配色 +120° +240°
- B8D4BB
Surf
- BECBEA
≈ Cuddle
- E8C1BB
≈ Rose Petal
分裂互补色 +150° +210°
- B8D4BB
Surf
- CEC5E6
≈ Italian Fitch
- E5C0CB
≈ Soap Pink
四角配色 +90° +180° +270°
对比度与无障碍
Ag
Fail白底
WCAG 1.59:1 · APCA Lc 27
Ag
AAA黑底
WCAG 13.17:1 · APCA Lc 76
最佳文字颜色: #000000
WCAG 13.17:1 (AAA) · APCA Lc 76
Contrast pairs
代码片段
CSS
:root {
--surf: #b8d4bb;
--surf-rgb: 184 212 187;
--surf-oklch: oklch(0.842 0.046 148.2);
}
.element {
color: var(--surf);
background-color: hsl(126 25% 78%);
border-color: oklch(0.842 0.046 148.2);
}Tailwind CSS v4
@theme {
--color-surf: #b8d4bb;
--color-surf-50: #ecf9ee;
--color-surf-100: #deece0;
--color-surf-200: #c7daca;
--color-surf-300: #a8beab;
--color-surf-400: #8da690;
--color-surf-500: #728f75;
--color-surf-600: #617964;
--color-surf-700: #4d614f;
--color-surf-800: #384739;
--color-surf-900: #273127;
--color-surf-950: #151d15;
}SCSS
$surf: #b8d4bb;
$surf-rgb: 184, 212, 187;
$surf-light: mix(#fff, $surf, 20%);
$surf-dark: mix(#000, $surf, 20%);
.element {
color: $surf;
box-shadow: 0 0 0 2px rgba($surf, 0.35);
}