Màu có tên gần nhất · #5A78E3
#5A78E3
Màu có tên gần nhất: Blue Öyster Cult
#5A78E3 (rgb(90 120 227), hsl(227 71% 62%), oklch(0.604 0.165 269.2)) gần nhất với màu có tên Blue Öyster Cult. 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.
#5A78E3
oklch(0.604 0.165 269.2)
Chuyển đổi màu
- HEX
- #5a78e3
- RGB
- rgb(90 120 227)
- HSL
- hsl(227 71% 62%)
- HWB
- hwb(227 35% 11%)
- OKLCH
- oklch(0.604 0.165 269.2)
- OKLab
- oklab(0.604 -0.002 -0.165)
- CIE Lab
- lab(52.28 14.33 -58.89)
- LCH
- lch(52.28 60.61 283.7)
- CMYK
- cmyk(60% 47% 0% 11%)
Sắc nhạt · Sắc đậm · Sắc xám
Sắc nhạt
- 6986E7
- 7894EB
- 88A2EE
- 98AFF2
- A9BDF5
- B9CAF7
- CAD7FA
- DCE4FC
- EDF2FE
Sắc đậm
- 4D67C5
- 4157A8
- 35488C
- 293971
- 1E2A57
- 131D3F
- 091027
- 030512
- 000103
Sắc xám
- 5E7AD9
- 617BD0
- 657DC6
- 697EBC
- 6D7FB3
- 707FA9
- 74809F
- 788095
- 7C808B
Hòa sắc
Bổ túc +180°
- 5A78E3
Blue Öyster Cult
- 9F7C00
≈ Yellowish Brown
Tương đồng -30° +30°
- 5A78E3
Blue Öyster Cult
- 008AC9
≈ Newport Blue
- 9166D5
≈ Amethyst
Bộ ba +120° +240°
- 5A78E3
Blue Öyster Cult
- D25143
≈ Gladiola
- 109B45
≈ Boogie Blast
Bổ túc chia +150° +210°
- 5A78E3
Blue Öyster Cult
- BE6800
≈ Camel Fur
- 788C00
≈ Canopy
Bộ bốn +90° +180° +270°
- 5A78E3
Blue Öyster Cult
- CB4E7F
≈ Pink Flambé
- 9F7C00
≈ Yellowish Brown
- 009683
≈ Approval Green
Tương phản và khả năng tiếp cận
Ag
FailTrên nền trắng
WCAG 4.01:1 · APCA Lc 67
Ag
AATrên nền đen
WCAG 5.23:1 · APCA Lc 34
Màu chữ tốt nhất: #000000
WCAG 5.23:1 (AA) · APCA Lc 34
Contrast pairs
Đoạn mã
CSS
:root {
--blue-oyster-cult: #5a78e3;
--blue-oyster-cult-rgb: 90 120 227;
--blue-oyster-cult-oklch: oklch(0.604 0.165 269.2);
}
.element {
color: var(--blue-oyster-cult);
background-color: hsl(227 71% 62%);
border-color: oklch(0.604 0.165 269.2);
}Tailwind CSS v4
@theme {
--color-blue-oyster-cult: #5a78e3;
--color-blue-oyster-cult-50: #e3f3ff;
--color-blue-oyster-cult-100: #d3e6ff;
--color-blue-oyster-cult-200: #bad1ff;
--color-blue-oyster-cult-300: #99b2ff;
--color-blue-oyster-cult-400: #7797ff;
--color-blue-oyster-cult-500: #5b7bf2;
--color-blue-oyster-cult-600: #4d68cc;
--color-blue-oyster-cult-700: #3d54a4;
--color-blue-oyster-cult-800: #293d7b;
--color-blue-oyster-cult-900: #1b2a57;
--color-blue-oyster-cult-950: #0c173b;
}SCSS
$blue-oyster-cult: #5a78e3;
$blue-oyster-cult-rgb: 90, 120, 227;
$blue-oyster-cult-light: mix(#fff, $blue-oyster-cult, 20%);
$blue-oyster-cult-dark: mix(#000, $blue-oyster-cult, 20%);
.element {
color: $blue-oyster-cult;
box-shadow: 0 0 0 2px rgba($blue-oyster-cult, 0.35);
}