Adlandırılmış renk · #BBC5E2
California Lilac
California Lilac, #BBC5E2: rgb(187 197 226), hsl(225 40% 81%), oklch(0.825 0.042 270.4). Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
What does Blue mean? → · California Lilac color name →
#BBC5E2
oklch(0.825 0.042 270.4)
Renk dönüşümleri
- HEX
- #bbc5e2
- RGB
- rgb(187 197 226)
- HSL
- hsl(225 40% 81%)
- HWB
- hwb(225 73% 11%)
- OKLCH
- oklch(0.825 0.042 270.4)
- OKLab
- oklab(0.825 0 -0.042)
- CIE Lab
- lab(79.44 0.89 -15.72)
- LCH
- lch(79.44 15.75 273.3)
- CMYK
- cmyk(17% 13% 0% 11%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- C2CBE5
- C8D0E8
- CFD6EB
- D6DCEE
- DDE2F1
- E3E8F4
- EAEDF6
- F1F3F9
- F8F9FC
Koyu tonlar
- A2ABC4
- 8A92A8
- 73798C
- 5C6171
- 464B57
- 32353E
- 1F2127
- 0D0E12
- 020203
Gri tonlar
- B5BED8
- AFB7CE
- A9B0C4
- A3A9BA
- 9DA2B0
- 979BA6
- 91949C
- 8B8D93
- 868789
Renk uyumları
Tamamlayıcı +180°
- BBC5E2
California Lilac
- D0C5A7
≈ Cyrus Grass
Analog -30° +30°
- BBC5E2
California Lilac
- AECADF
≈ Life at Sea
- CAC0DE
≈ Digital Lavender
Üçlü +120° +240°
- BBC5E2
California Lilac
- E0BCB6
≈ Balcony Rose
- B3CEB8
≈ Gossamer Green
Bölünmüş tamamlayıcı +150° +210°
- BBC5E2
California Lilac
- DBC0AB
≈ Boudoir Beige
- C2CAAC
≈ Desert Hot Springs
Dörtlü +90° +180° +270°
- BBC5E2
California Lilac
- DEBBC4
≈ Love in a Mist
- D0C5A7
≈ Cyrus Grass
- A9CFC7
≈ Sea Inspired
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 1.72:1 · APCA Lc 31
Ag
AAASiyah üzerinde
WCAG 12.19:1 · APCA Lc 72
En iyi metin rengi: #000000
WCAG 12.19:1 (AAA) · APCA Lc 72
Contrast pairs
Kod parçacıkları
CSS
:root {
--california-lilac: #bbc5e2;
--california-lilac-rgb: 187 197 226;
--california-lilac-oklch: oklch(0.825 0.042 270.4);
}
.element {
color: var(--california-lilac);
background-color: hsl(225 40% 81%);
border-color: oklch(0.825 0.042 270.4);
}Tailwind CSS v4
@theme {
--color-california-lilac: #bbc5e2;
--color-california-lilac-50: #f1f5ff;
--color-california-lilac-100: #e3e7f7;
--color-california-lilac-200: #ced4e7;
--color-california-lilac-300: #b0b7ce;
--color-california-lilac-400: #959eb8;
--color-california-lilac-500: #7b85a3;
--color-california-lilac-600: #68718a;
--color-california-lilac-700: #535a6e;
--color-california-lilac-800: #3c4251;
--color-california-lilac-900: #292e39;
--color-california-lilac-950: #171a23;
}SCSS
$california-lilac: #bbc5e2;
$california-lilac-rgb: 187, 197, 226;
$california-lilac-light: mix(#fff, $california-lilac, 20%);
$california-lilac-dark: mix(#000, $california-lilac, 20%);
.element {
color: $california-lilac;
box-shadow: 0 0 0 2px rgba($california-lilac, 0.35);
}