En yakın adlandırılmış renk · #4E90BC
#4E90BC
En yakın adlandırılmış renk: Canadian Tuxedo
#4E90BC (rgb(78 144 188), hsl(204 45% 52%), oklch(0.628 0.095 239.8)) en çok Canadian Tuxedo adlı renge yakındır. Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
#4E90BC
oklch(0.628 0.095 239.8)
Renk dönüşümleri
- HEX
- #4e90bc
- RGB
- rgb(78 144 188)
- HSL
- hsl(204 45% 52%)
- HWB
- hwb(204 31% 26%)
- OKLCH
- oklch(0.628 0.095 239.8)
- OKLab
- oklab(0.628 -0.048 -0.082)
- CIE Lab
- lab(56.82 -11.82 -29.88)
- LCH
- lch(56.82 32.13 248.4)
- CMYK
- cmyk(59% 23% 0% 26%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- 619BC3
- 73A6CA
- 84B1D1
- 96BCD7
- A7C7DE
- B9D2E5
- CADDEB
- DCE8F2
- EDF4F9
Koyu tonlar
- 437DA3
- 386A8B
- 2D5773
- 23455D
- 193447
- 0F2432
- 07151F
- 02070D
- 000102
Gri tonlar
- 558FB6
- 5B8DB0
- 608CAA
- 668AA4
- 6B899E
- 6F8798
- 748592
- 78848C
- 7C8286
Renk uyumları
Tamamlayıcı +180°
- 4E90BC
Canadian Tuxedo
- B37A4B
≈ Rocky Racoon
Analog -30° +30°
- 4E90BC
Canadian Tuxedo
- 3098A8
≈ Aqua Dance
- 7286C2
≈ Violets Are Blue
Üçlü +120° +240°
- 4E90BC
Canadian Tuxedo
- B77086
≈ Tapestry
- 81914D
≈ Camo
Bölünmüş tamamlayıcı +150° +210°
- 4E90BC
Canadian Tuxedo
- BB7266
≈ Azalea Pot
- 9F863F
≈ Madagascar
Dörtlü +90° +180° +270°
- 4E90BC
Canadian Tuxedo
- A973A4
≈ Orchid Kiss
- B37A4B
≈ Rocky Racoon
- 5D996A
≈ Wildness Mint
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 3.47:1 · APCA Lc 62
Ag
AASiyah üzerinde
WCAG 6.03:1 · APCA Lc 40
En iyi metin rengi: #000000
WCAG 6.03:1 (AA) · APCA Lc 40
Contrast pairs
Kod parçacıkları
CSS
:root {
--canadian-tuxedo: #4e90bc;
--canadian-tuxedo-rgb: 78 144 188;
--canadian-tuxedo-oklch: oklch(0.628 0.095 239.8);
}
.element {
color: var(--canadian-tuxedo);
background-color: hsl(204 45% 52%);
border-color: oklch(0.628 0.095 239.8);
}Tailwind CSS v4
@theme {
--color-canadian-tuxedo: #4e90bc;
--color-canadian-tuxedo-50: #def9ff;
--color-canadian-tuxedo-100: #cdedff;
--color-canadian-tuxedo-200: #b1dafa;
--color-canadian-tuxedo-300: #8cbee4;
--color-canadian-tuxedo-400: #68a6d1;
--color-canadian-tuxedo-500: #438ebe;
--color-canadian-tuxedo-600: #3a78a1;
--color-canadian-tuxedo-700: #2e6081;
--color-canadian-tuxedo-800: #1e475f;
--color-canadian-tuxedo-900: #143143;
--color-canadian-tuxedo-950: #051d2b;
}SCSS
$canadian-tuxedo: #4e90bc;
$canadian-tuxedo-rgb: 78, 144, 188;
$canadian-tuxedo-light: mix(#fff, $canadian-tuxedo, 20%);
$canadian-tuxedo-dark: mix(#000, $canadian-tuxedo, 20%);
.element {
color: $canadian-tuxedo;
box-shadow: 0 0 0 2px rgba($canadian-tuxedo, 0.35);
}