Adlandırılmış renk · #7B90A2
Jean Jacket Blue
Jean Jacket Blue, #7B90A2: rgb(123 144 162), hsl(208 17% 56%), oklch(0.643 0.036 244.2). Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
What does Blue mean? → · Jean Jacket Blue color name →
#7B90A2
oklch(0.643 0.036 244.2)
Renk dönüşümleri
- HEX
- #7b90a2
- RGB
- rgb(123 144 162)
- HSL
- hsl(208 17% 56%)
- HWB
- hwb(208 48% 36%)
- OKLCH
- oklch(0.643 0.036 244.2)
- OKLab
- oklab(0.643 -0.016 -0.033)
- CIE Lab
- lab(58.59 -4.64 -12.18)
- LCH
- lch(58.59 13.03 249.2)
- CMYK
- cmyk(24% 11% 0% 36%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- 889BAB
- 94A5B4
- A1B0BD
- AEBBC6
- BBC6D0
- C8D1D9
- D6DDE2
- E3E8EC
- F1F3F5
Koyu tonlar
- 6A7D8C
- 5A6A77
- 4A5763
- 3A454F
- 2C343C
- 1E242A
- 101519
- 05070A
- 010101
Gri tonlar
- 7C8E9F
- 7C8D9B
- 7D8B98
- 7D8A94
- 7E8891
- 7E868E
- 7F858A
- 7F8387
- 808283
Renk uyumları
Tamamlayıcı +180°
- 7B90A2
Jean Jacket Blue
- 9D8977
≈ Sycamore Tan
Analog -30° +30°
- 7B90A2
Jean Jacket Blue
- 74939B
≈ Cavolo Nero
- 868CA4
≈ Violet Verbena
Üçlü +120° +240°
- 7B90A2
Jean Jacket Blue
- A1848A
≈ Wallflower
- 889179
≈ Eucalyptus Wreath
Bölünmüş tamamlayıcı +150° +210°
- 7B90A2
Jean Jacket Blue
- A2867F
≈ Velvety Chestnut
- 948D75
≈ Carriage Door
Dörtlü +90° +180° +270°
- 7B90A2
Jean Jacket Blue
- 9B8596
≈ Berry Bright
- 9D8977
≈ Sycamore Tan
- 7D9483
≈ Fish Camp Woods
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 3.30:1 · APCA Lc 60
Ag
AASiyah üzerinde
WCAG 6.35:1 · APCA Lc 41
En iyi metin rengi: #000000
WCAG 6.35:1 (AA) · APCA Lc 41
Contrast pairs
Kod parçacıkları
CSS
:root {
--jean-jacket-blue: #7b90a2;
--jean-jacket-blue-rgb: 123 144 162;
--jean-jacket-blue-oklch: oklch(0.643 0.036 244.2);
}
.element {
color: var(--jean-jacket-blue);
background-color: hsl(208 17% 56%);
border-color: oklch(0.643 0.036 244.2);
}Tailwind CSS v4
@theme {
--color-jean-jacket-blue: #7b90a2;
--color-jean-jacket-blue-50: #edf6ff;
--color-jean-jacket-blue-100: #dfe9f4;
--color-jean-jacket-blue-200: #c8d6e3;
--color-jean-jacket-blue-300: #a9bac9;
--color-jean-jacket-blue-400: #8da1b3;
--color-jean-jacket-blue-500: #72899d;
--color-jean-jacket-blue-600: #617485;
--color-jean-jacket-blue-700: #4d5d6a;
--color-jean-jacket-blue-800: #38444e;
--color-jean-jacket-blue-900: #262f36;
--color-jean-jacket-blue-950: #141c21;
}SCSS
$jean-jacket-blue: #7b90a2;
$jean-jacket-blue-rgb: 123, 144, 162;
$jean-jacket-blue-light: mix(#fff, $jean-jacket-blue, 20%);
$jean-jacket-blue-dark: mix(#000, $jean-jacket-blue, 20%);
.element {
color: $jean-jacket-blue;
box-shadow: 0 0 0 2px rgba($jean-jacket-blue, 0.35);
}