Cor nomeada · #B4AECC
Lavender Dream
Lavender Dream é #B4AECC: rgb(180 174 204), hsl(252 23% 74%), oklch(0.766 0.043 294.5). Veja tons claros, sombras, harmonias, contraste WCAG e APCA e código CSS, Tailwind v4 e SCSS.
What does Purple mean? → · Lavender Dream color name →
#B4AECC
oklch(0.766 0.043 294.5)
Conversões de cor
- HEX
- #b4aecc
- RGB
- rgb(180 174 204)
- HSL
- hsl(252 23% 74%)
- HWB
- hwb(252 68% 20%)
- OKLCH
- oklch(0.766 0.043 294.5)
- OKLab
- oklab(0.766 0.018 -0.039)
- CIE Lab
- lab(72.33 6.63 -14.5)
- LCH
- lch(72.33 15.94 294.6)
- CMYK
- cmyk(12% 15% 0% 20%)
Tons claros · Sombras · Tons
Tons claros
- BBB6D1
- C3BED6
- CAC6DB
- D1CEE0
- D9D6E6
- E0DEEB
- E8E6F0
- F0EEF5
- F7F7FA
Sombras
- 9C97B1
- 858097
- 6E6A7E
- 585565
- 44414E
- 302E37
- 1D1C22
- 0C0B0F
- 020102
Tons
- AFA9C4
- A9A5BC
- A4A0B5
- 9F9BAD
- 9A97A5
- 94929E
- 8F8E96
- 8A898F
- 858587
Harmonias de cor
Complementar +180°
- B4AECC
Lavender Dream
- B2B698
≈ Mountain Green
Análoga -30° +30°
- B4AECC
Lavender Dream
- A5B3CF
≈ Kentucky Blue
- C1AAC2
≈ Linnea Blossom
Tríade +120° +240°
- B4AECC
Lavender Dream
- C9AC9A
≈ Powdered Allspice
- 97BCB1
≈ Spring Stream
Complementar dividida +150° +210°
- B4AECC
Lavender Dream
- C0B194
≈ Rock Cliffs
- A3BAA2
≈ Reeds
Tétrade +90° +180° +270°
- B4AECC
Lavender Dream
- CDA9A5
≈ Rosy Tan
- B2B698
≈ Mountain Green
- 94BBC0
≈ Casual Day
Contraste e acessibilidade
Ag
FailSobre branco
WCAG 2.12:1 · APCA Lc 42
Ag
AAASobre preto
WCAG 9.86:1 · APCA Lc 60
Melhor cor de texto: #000000
WCAG 9.86:1 (AAA) · APCA Lc 60
Contrast pairs
Trechos de código
CSS
:root {
--lavender-dream: #b4aecc;
--lavender-dream-rgb: 180 174 204;
--lavender-dream-oklch: oklch(0.766 0.043 294.5);
}
.element {
color: var(--lavender-dream);
background-color: hsl(252 23% 74%);
border-color: oklch(0.766 0.043 294.5);
}Tailwind CSS v4
@theme {
--color-lavender-dream: #b4aecc;
--color-lavender-dream-50: #f6f3ff;
--color-lavender-dream-100: #e9e5f5;
--color-lavender-dream-200: #d6d1e5;
--color-lavender-dream-300: #b9b3cb;
--color-lavender-dream-400: #a09ab6;
--color-lavender-dream-500: #8881a0;
--color-lavender-dream-600: #736d87;
--color-lavender-dream-700: #5c576d;
--color-lavender-dream-800: #434050;
--color-lavender-dream-900: #2e2c38;
--color-lavender-dream-950: #1b1922;
}SCSS
$lavender-dream: #b4aecc;
$lavender-dream-rgb: 180, 174, 204;
$lavender-dream-light: mix(#fff, $lavender-dream, 20%);
$lavender-dream-dark: mix(#000, $lavender-dream, 20%);
.element {
color: $lavender-dream;
box-shadow: 0 0 0 2px rgba($lavender-dream, 0.35);
}