Màu có tên · #B8E3ED
Ocean Front
Ocean Front là #B8E3ED: rgb(184 227 237), hsl(191 60% 83%), oklch(0.889 0.047 213.4). Xem sắc nhạt, sắc đậm, hòa sắc, tương phản WCAG và APCA, cùng mã CSS, Tailwind v4 và SCSS.
What does Cyan mean? → · Ocean Front color name →
#B8E3ED
oklch(0.889 0.047 213.4)
Chuyển đổi màu
- HEX
- #b8e3ed
- RGB
- rgb(184 227 237)
- HSL
- hsl(191 60% 83%)
- HWB
- hwb(191 72% 7%)
- OKLCH
- oklch(0.889 0.047 213.4)
- OKLab
- oklab(0.889 -0.039 -0.026)
- CIE Lab
- lab(87.42 -12.83 -9.75)
- LCH
- lch(87.42 16.12 217.2)
- CMYK
- cmyk(22% 4% 0% 7%)
Sắc nhạt · Sắc đậm · Sắc xám
Sắc nhạt
- BFE6EF
- C6E9F1
- CEEBF2
- D5EEF4
- DCF1F6
- E3F4F8
- EAF7FA
- F1F9FB
- F8FCFD
Sắc đậm
- A0C5CE
- 88A8B0
- 718C93
- 5B7177
- 45575C
- 313F42
- 1E272A
- 0C1214
- 020303
Sắc xám
- B2D9E2
- ADCED6
- A7C4CB
- A2BAC0
- 9CB0B5
- 97A6AA
- 919D9F
- 8B9395
- 86898A
Hòa sắc
Bổ túc +180°
- B8E3ED
Ocean Front
- F8D0C7
≈ Pink Cloud
Tương đồng -30° +30°
- B8E3ED
Ocean Front
- B9E5DD
≈ Soothing Sea
- C1DFF7
≈ Arctic Paradise
Bộ ba +120° +240°
- B8E3ED
Ocean Front
- EECFE8
≈ Poodle Pink
- E4DAB8
≈ Lemon Balm
Bổ túc chia +150° +210°
- B8E3ED
Ocean Front
- F6CED7
≈ Icy Pink
- F1D4BB
≈ Pulled Taffy
Bộ bốn +90° +180° +270°
- B8E3ED
Ocean Front
- E0D3F4
≈ Japan Blush
- F8D0C7
≈ Pink Cloud
- D4E0BE
≈ Security
Tương phản và khả năng tiếp cận
Ag
FailTrên nền trắng
WCAG 1.37:1 · APCA Lc 18
Ag
AAATrên nền đen
WCAG 15.24:1 · APCA Lc 85
Màu chữ tốt nhất: #000000
WCAG 15.24:1 (AAA) · APCA Lc 85
Contrast pairs
Đoạn mã
CSS
:root {
--ocean-front: #b8e3ed;
--ocean-front-rgb: 184 227 237;
--ocean-front-oklch: oklch(0.889 0.047 213.4);
}
.element {
color: var(--ocean-front);
background-color: hsl(191 60% 83%);
border-color: oklch(0.889 0.047 213.4);
}Tailwind CSS v4
@theme {
--color-ocean-front: #b8e3ed;
--color-ocean-front-50: #e7f9fe;
--color-ocean-front-100: #d7ecf2;
--color-ocean-front-200: #bfdae1;
--color-ocean-front-300: #9dbec7;
--color-ocean-front-400: #7fa6af;
--color-ocean-front-500: #628f99;
--color-ocean-front-600: #537981;
--color-ocean-front-700: #426168;
--color-ocean-front-800: #2f474c;
--color-ocean-front-900: #203135;
--color-ocean-front-950: #0f1d20;
}SCSS
$ocean-front: #b8e3ed;
$ocean-front-rgb: 184, 227, 237;
$ocean-front-light: mix(#fff, $ocean-front, 20%);
$ocean-front-dark: mix(#000, $ocean-front, 20%);
.element {
color: $ocean-front;
box-shadow: 0 0 0 2px rgba($ocean-front, 0.35);
}