En yakın adlandırılmış renk · #A2B4FF
#A2B4FF
En yakın adlandırılmış renk: Wondrous Wisteria
#A2B4FF (rgb(162 180 255), hsl(228 100% 82%), oklch(0.785 0.109 273.3)) en çok Wondrous Wisteria adlı renge yakındır. Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
#A2B4FF
oklch(0.785 0.109 273.3)
Renk dönüşümleri
- HEX
- #a2b4ff
- RGB
- rgb(162 180 255)
- HSL
- hsl(228 100% 82%)
- HWB
- hwb(228 64% 0%)
- OKLCH
- oklch(0.785 0.109 273.3)
- OKLab
- oklab(0.785 0.006 -0.109)
- CIE Lab
- lab(74.07 7.02 -39.59)
- LCH
- lch(74.07 40.2 280.1)
- CMYK
- cmyk(36% 29% 0% 0%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- ABBCFF
- B4C3FF
- BDCBFF
- C6D2FF
- CFDAFF
- D9E1FF
- E2E9FF
- ECF0FF
- F5F8FF
Koyu tonlar
- 8C9CDE
- 7785BE
- 636E9E
- 4F5880
- 3C4463
- 2A3048
- 191D2E
- 0A0C16
- 010203
Gri tonlar
- 9EAFF2
- 9BAAE5
- 98A5D8
- 949FCB
- 919ABF
- 8D95B2
- 8A90A5
- 878B99
- 83858C
Renk uyumları
Tamamlayıcı +180°
- A2B4FF
Wondrous Wisteria
- D0B762
≈ Banh Bot Loc Dumpling
Analog -30° +30°
- A2B4FF
Wondrous Wisteria
- 78C1F9
≈ Maya Blue
- C7A8F2
≈ Purple Hepatica
Üçlü +120° +240°
- A2B4FF
Wondrous Wisteria
- F69F8B
≈ Poppy Petal
- 7FCD98
≈ Garden Glow
Bölünmüş tamamlayıcı +150° +210°
- A2B4FF
Wondrous Wisteria
- EAA96C
≈ Dune King
- ABC575
≈ Old Lime
Dörtlü +90° +180° +270°
- A2B4FF
Wondrous Wisteria
- F49BB2
≈ Harmonious Rose
- D0B762
≈ Banh Bot Loc Dumpling
- 59D0C0
≈ Jamaican Jade
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 1.99:1 · APCA Lc 39
Ag
AAASiyah üzerinde
WCAG 10.50:1 · APCA Lc 64
En iyi metin rengi: #000000
WCAG 10.50:1 (AAA) · APCA Lc 64
Contrast pairs
Kod parçacıkları
CSS
:root {
--wondrous-wisteria: #a2b4ff;
--wondrous-wisteria-rgb: 162 180 255;
--wondrous-wisteria-oklch: oklch(0.785 0.109 273.3);
}
.element {
color: var(--wondrous-wisteria);
background-color: hsl(228 100% 82%);
border-color: oklch(0.785 0.109 273.3);
}Tailwind CSS v4
@theme {
--color-wondrous-wisteria: #a2b4ff;
--color-wondrous-wisteria-50: #ecf3ff;
--color-wondrous-wisteria-100: #dde6ff;
--color-wondrous-wisteria-200: #c6d1ff;
--color-wondrous-wisteria-300: #a7b3f0;
--color-wondrous-wisteria-400: #899adf;
--color-wondrous-wisteria-500: #6f80ce;
--color-wondrous-wisteria-600: #5e6cae;
--color-wondrous-wisteria-700: #4b578c;
--color-wondrous-wisteria-800: #354068;
--color-wondrous-wisteria-900: #242c49;
--color-wondrous-wisteria-950: #131930;
}SCSS
$wondrous-wisteria: #a2b4ff;
$wondrous-wisteria-rgb: 162, 180, 255;
$wondrous-wisteria-light: mix(#fff, $wondrous-wisteria, 20%);
$wondrous-wisteria-dark: mix(#000, $wondrous-wisteria, 20%);
.element {
color: $wondrous-wisteria;
box-shadow: 0 0 0 2px rgba($wondrous-wisteria, 0.35);
}