Adlandırılmış renk · #90B3C2
Bright Bluebonnet
Bright Bluebonnet, #90B3C2: rgb(144 179 194), hsl(198 29% 66%), oklch(0.746 0.044 225.8). Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
What does Cyan mean? → · Bright Bluebonnet color name →
#90B3C2
oklch(0.746 0.044 225.8)
Renk dönüşümleri
- HEX
- #90b3c2
- RGB
- rgb(144 179 194)
- HSL
- hsl(198 29% 66%)
- HWB
- hwb(198 56% 24%)
- OKLCH
- oklch(0.746 0.044 225.8)
- OKLab
- oklab(0.746 -0.03 -0.031)
- CIE Lab
- lab(70.73 -9.7 -11.78)
- LCH
- lch(70.73 15.26 230.5)
- CMYK
- cmyk(26% 8% 0% 24%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- 9BBAC8
- A6C2CE
- B1C9D4
- BCD1DA
- C7D9E0
- D2E0E6
- DDE8ED
- E8F0F3
- F4F7F9
Koyu tonlar
- 7D9BA8
- 6A848F
- 576E77
- 455860
- 344349
- 242F34
- 151D20
- 070C0E
- 010102
Gri tonlar
- 8FAEBB
- 8DA9B4
- 8CA3AE
- 8A9EA7
- 8999A1
- 87949A
- 858F93
- 848A8D
- 828586
Renk uyumları
Tamamlayıcı +180°
- 90B3C2
Bright Bluebonnet
- C5A596
≈ Howdy Partner
Analog -30° +30°
- 90B3C2
Bright Bluebonnet
- 8DB6B6
≈ Eyefull
- 9BAEC9
≈ Satin Soft Blue
Üçlü +120° +240°
- 90B3C2
Bright Bluebonnet
- C2A2B3
≈ Hollyhock Pink
- B0AF8F
≈ That’s Atomic
Bölünmüş tamamlayıcı +150° +210°
- 90B3C2
Bright Bluebonnet
- C7A2A3
≈ Pale Mauve
- BDA98E
≈ Coffee Diva
Dörtlü +90° +180° +270°
- 90B3C2
Bright Bluebonnet
- B8A5C0
≈ Viola Sororia
- C5A596
≈ Howdy Partner
- A1B398
≈ Banksia
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 2.23:1 · APCA Lc 44
Ag
AAASiyah üzerinde
WCAG 9.41:1 · APCA Lc 58
En iyi metin rengi: #000000
WCAG 9.41:1 (AAA) · APCA Lc 58
Contrast pairs
Kod parçacıkları
CSS
:root {
--bright-bluebonnet: #90b3c2;
--bright-bluebonnet-rgb: 144 179 194;
--bright-bluebonnet-oklch: oklch(0.746 0.044 225.8);
}
.element {
color: var(--bright-bluebonnet);
background-color: hsl(198 29% 66%);
border-color: oklch(0.746 0.044 225.8);
}Tailwind CSS v4
@theme {
--color-bright-bluebonnet: #90b3c2;
--color-bright-bluebonnet-50: #e9f8ff;
--color-bright-bluebonnet-100: #daebf4;
--color-bright-bluebonnet-200: #c2d8e3;
--color-bright-bluebonnet-300: #a1bcc9;
--color-bright-bluebonnet-400: #84a4b2;
--color-bright-bluebonnet-500: #678d9c;
--color-bright-bluebonnet-600: #587784;
--color-bright-bluebonnet-700: #465f6a;
--color-bright-bluebonnet-800: #32464e;
--color-bright-bluebonnet-900: #223036;
--color-bright-bluebonnet-950: #111d21;
}SCSS
$bright-bluebonnet: #90b3c2;
$bright-bluebonnet-rgb: 144, 179, 194;
$bright-bluebonnet-light: mix(#fff, $bright-bluebonnet, 20%);
$bright-bluebonnet-dark: mix(#000, $bright-bluebonnet, 20%);
.element {
color: $bright-bluebonnet;
box-shadow: 0 0 0 2px rgba($bright-bluebonnet, 0.35);
}