Màu có tên gần nhất · #36A7C4
#36A7C4
Màu có tên gần nhất: Pacific Blue
#36A7C4 (rgb(54 167 196), hsl(192 57% 49%), oklch(0.678 0.107 218.8)) gần nhất với màu có tên Pacific Blue. 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.
#36A7C4
oklch(0.678 0.107 218.8)
Chuyển đổi màu
- HEX
- #36a7c4
- RGB
- rgb(54 167 196)
- HSL
- hsl(192 57% 49%)
- HWB
- hwb(192 21% 23%)
- OKLCH
- oklch(0.678 0.107 218.8)
- OKLab
- oklab(0.678 -0.083 -0.067)
- CIE Lab
- lab(63.24 -25.32 -24.61)
- LCH
- lch(63.24 35.31 224.2)
- CMYK
- cmyk(72% 15% 0% 23%)
Sắc nhạt · Sắc đậm · Sắc xám
Sắc nhạt
- 52B0CA
- 69B9D0
- 7DC2D6
- 91CADC
- A4D3E2
- B6DCE8
- C9E5EE
- DBEEF3
- EDF6F9
Sắc đậm
- 2E91AA
- 257B91
- 1E6678
- 165261
- 0F3E4A
- 082C35
- 031A21
- 010A0E
- 000102
Sắc xám
- 44A3BD
- 4FA0B6
- 589CAF
- 6098A9
- 6794A2
- 6D909B
- 728C94
- 77888E
- 7C8487
Hòa sắc
Bổ túc +180°
- 36A7C4
Pacific Blue
- D08066
≈ Fire Chalk
Tương đồng -30° +30°
- 36A7C4
Pacific Blue
- 2EADA5
≈ Tropical Tree
- 619DD7
≈ Blue Bay
Bộ ba +120° +240°
- 36A7C4
Pacific Blue
- C37DAE
≈ Strawberry Freeze
- A89944
≈ Prickly Pear
Bổ túc chia +150° +210°
- 36A7C4
Pacific Blue
- D07B8A
≈ Dusky Pink
- C28B49
≈ Golden Leaf
Bộ bốn +90° +180° +270°
- 36A7C4
Pacific Blue
- AB85CA
≈ Wisteria
- D08066
≈ Fire Chalk
- 83A55B
≈ Springview Green
Tương phản và khả năng tiếp cận
Ag
FailTrên nền trắng
WCAG 2.80:1 · APCA Lc 54
Ag
AAATrên nền đen
WCAG 7.48:1 · APCA Lc 48
Màu chữ tốt nhất: #000000
WCAG 7.48:1 (AAA) · APCA Lc 48
Contrast pairs
Đoạn mã
CSS
:root {
--pacific-blue: #36a7c4;
--pacific-blue-rgb: 54 167 196;
--pacific-blue-oklch: oklch(0.678 0.107 218.8);
}
.element {
color: var(--pacific-blue);
background-color: hsl(192 57% 49%);
border-color: oklch(0.678 0.107 218.8);
}Tailwind CSS v4
@theme {
--color-pacific-blue: #36a7c4;
--color-pacific-blue-50: #d5fdff;
--color-pacific-blue-100: #c1f1ff;
--color-pacific-blue-200: #a1dff4;
--color-pacific-blue-300: #76c4de;
--color-pacific-blue-400: #47adc9;
--color-pacific-blue-500: #0096b6;
--color-pacific-blue-600: #007f99;
--color-pacific-blue-700: #00667b;
--color-pacific-blue-800: #004b5a;
--color-pacific-blue-900: #00343f;
--color-pacific-blue-950: #001f28;
}SCSS
$pacific-blue: #36a7c4;
$pacific-blue-rgb: 54, 167, 196;
$pacific-blue-light: mix(#fff, $pacific-blue, 20%);
$pacific-blue-dark: mix(#000, $pacific-blue, 20%);
.element {
color: $pacific-blue;
box-shadow: 0 0 0 2px rgba($pacific-blue, 0.35);
}