Adlandırılmış renk · #4E9AB0
Starflower Blue
Starflower Blue, #4E9AB0: rgb(78 154 176), hsl(193 39% 50%), oklch(0.646 0.082 219.2). Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
What does Cyan mean? → · Starflower Blue color name →
#4E9AB0
oklch(0.646 0.082 219.2)
Renk dönüşümleri
- HEX
- #4e9ab0
- RGB
- rgb(78 154 176)
- HSL
- hsl(193 39% 50%)
- HWB
- hwb(193 31% 31%)
- OKLCH
- oklch(0.646 0.082 219.2)
- OKLab
- oklab(0.646 -0.063 -0.052)
- CIE Lab
- lab(59.43 -19.69 -19.14)
- LCH
- lch(59.43 27.46 224.2)
- CMYK
- cmyk(56% 13% 0% 31%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- 62A4B8
- 74AEC0
- 86B8C8
- 97C2CF
- A9CCD7
- BAD6DF
- CBE0E7
- DCEAEF
- EEF5F7
Koyu tonlar
- 438599
- 387182
- 2D5E6C
- 234B56
- 193942
- 0F272E
- 07171C
- 02090B
- 000101
Gri tonlar
- 5598AB
- 5C95A6
- 6193A2
- 67909D
- 6C8D98
- 708B93
- 75888E
- 79858A
- 7C8385
Renk uyumları
Tamamlayıcı +180°
- 4E9AB0
Starflower Blue
- B97D69
≈ Faneuil Brick
Analog -30° +30°
- 4E9AB0
Starflower Blue
- 4B9E98
≈ Tourmaline Turquoise
- 6692BE
≈ Blue Marble
Üçlü +120° +240°
- 4E9AB0
Starflower Blue
- B07B9E
≈ Antique Hot Pink
- 9A8F53
≈ Dijonnaise
Bölünmüş tamamlayıcı +150° +210°
- 4E9AB0
Starflower Blue
- BA7983
≈ Mauve Seductress
- AF8556
≈ Cool Copper
Dörtlü +90° +180° +270°
- 4E9AB0
Starflower Blue
- 9D80B4
≈ Lush Lilac
- B97D69
≈ Faneuil Brick
- 7E9862
≈ Pea Aubergine
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 3.19:1 · APCA Lc 59
Ag
AASiyah üzerinde
WCAG 6.57:1 · APCA Lc 43
En iyi metin rengi: #000000
WCAG 6.57:1 (AA) · APCA Lc 43
Contrast pairs
Kod parçacıkları
CSS
:root {
--starflower-blue: #4e9ab0;
--starflower-blue-rgb: 78 154 176;
--starflower-blue-oklch: oklch(0.646 0.082 219.2);
}
.element {
color: var(--starflower-blue);
background-color: hsl(193 39% 50%);
border-color: oklch(0.646 0.082 219.2);
}Tailwind CSS v4
@theme {
--color-starflower-blue: #4e9ab0;
--color-starflower-blue-50: #ddfbff;
--color-starflower-blue-100: #cbeffb;
--color-starflower-blue-200: #aedded;
--color-starflower-blue-300: #88c2d5;
--color-starflower-blue-400: #63aabf;
--color-starflower-blue-500: #3b93ab;
--color-starflower-blue-600: #347c90;
--color-starflower-blue-700: #296374;
--color-starflower-blue-800: #1b4955;
--color-starflower-blue-900: #12333b;
--color-starflower-blue-950: #041e25;
}SCSS
$starflower-blue: #4e9ab0;
$starflower-blue-rgb: 78, 154, 176;
$starflower-blue-light: mix(#fff, $starflower-blue, 20%);
$starflower-blue-dark: mix(#000, $starflower-blue, 20%);
.element {
color: $starflower-blue;
box-shadow: 0 0 0 2px rgba($starflower-blue, 0.35);
}