Adlandırılmış renk · #107AB0
Nice Blue
Nice Blue, #107AB0: rgb(16 122 176), hsl(200 83% 38%), oklch(0.552 0.12 239.1). Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
What does Blue mean? → · Nice Blue color name →
#107AB0
oklch(0.552 0.12 239.1)
Renk dönüşümleri
- HEX
- #107ab0
- RGB
- rgb(16 122 176)
- HSL
- hsl(200 83% 38%)
- HWB
- hwb(200 6% 31%)
- OKLCH
- oklch(0.552 0.12 239.1)
- OKLab
- oklab(0.552 -0.062 -0.103)
- CIE Lab
- lab(47.88 -12.97 -37.07)
- LCH
- lch(47.88 39.27 250.7)
- CMYK
- cmyk(91% 31% 0% 31%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- 3687B8
- 5094C1
- 67A2C9
- 7EAFD1
- 93BCD9
- A9C9E1
- BED7E8
- D4E4F0
- E9F2F8
Koyu tonlar
- 0C6999
- 095982
- 06496C
- 043A56
- 022B42
- 011D2E
- 00101C
- 00050B
- 000101
Gri tonlar
- 287BAC
- 377CA7
- 437DA2
- 4E7E9E
- 577E99
- 607F94
- 697F8F
- 71808A
- 798085
Renk uyumları
Tamamlayıcı +180°
- 107AB0
Nice Blue
- A45E19
≈ Raw Umber
Analog -30° +30°
- 107AB0
Nice Blue
- 008190
≈ Briny
- 566DB8
≈ Amparo Blue
Üçlü +120° +240°
- 107AB0
Nice Blue
- A95170
≈ China Rose
- 6B7B18
≈ Murky Green
Bölünmüş tamamlayıcı +150° +210°
- 107AB0
Nice Blue
- AD5348
≈ Cherry Blink
- 8C6E00
≈ Vermin Brown
Dörtlü +90° +180° +270°
- 107AB0
Nice Blue
- 985694
≈ Purplish
- A45E19
≈ Raw Umber
- 368549
≈ Green Grass
Kontrast ve erişilebilirlik
Ag
AABeyaz üzerinde
WCAG 4.73:1 · APCA Lc 72
Ag
FailSiyah üzerinde
WCAG 4.43:1 · APCA Lc 29
En iyi metin rengi: #FFFFFF
WCAG 4.73:1 (AA) · APCA Lc 72
Contrast pairs
Kod parçacıkları
CSS
:root {
--nice-blue: #107ab0;
--nice-blue-rgb: 16 122 176;
--nice-blue-oklch: oklch(0.552 0.12 239.1);
}
.element {
color: var(--nice-blue);
background-color: hsl(200 83% 38%);
border-color: oklch(0.552 0.12 239.1);
}Tailwind CSS v4
@theme {
--color-nice-blue: #107ab0;
--color-nice-blue-50: #d8faff;
--color-nice-blue-100: #c5eeff;
--color-nice-blue-200: #a6dcff;
--color-nice-blue-300: #7ebfef;
--color-nice-blue-400: #53a8dd;
--color-nice-blue-500: #1c8fcc;
--color-nice-blue-600: #1c79ac;
--color-nice-blue-700: #17618a;
--color-nice-blue-800: #0a4866;
--color-nice-blue-900: #073248;
--color-nice-blue-950: #001d2f;
}SCSS
$nice-blue: #107ab0;
$nice-blue-rgb: 16, 122, 176;
$nice-blue-light: mix(#fff, $nice-blue, 20%);
$nice-blue-dark: mix(#000, $nice-blue, 20%);
.element {
color: $nice-blue;
box-shadow: 0 0 0 2px rgba($nice-blue, 0.35);
}