Cor nomeada · #858BC2
Pleated Mauve
Pleated Mauve é #858BC2: rgb(133 139 194), hsl(234 33% 64%), oklch(0.653 0.082 279). Veja tons claros, sombras, harmonias, contraste WCAG e APCA e código CSS, Tailwind v4 e SCSS.
What does Blue mean? → · Pleated Mauve color name →
#858BC2
oklch(0.653 0.082 279)
Conversões de cor
- HEX
- #858bc2
- RGB
- rgb(133 139 194)
- HSL
- hsl(234 33% 64%)
- HWB
- hwb(234 52% 24%)
- OKLCH
- oklch(0.653 0.082 279)
- OKLab
- oklab(0.653 0.013 -0.081)
- CIE Lab
- lab(58.97 7.51 -29.61)
- LCH
- lch(58.97 30.55 284.2)
- CMYK
- cmyk(31% 28% 0% 24%)
Tons claros · Sombras · Tons
Tons claros
- 9096C8
- 9CA2CF
- A8ADD5
- B4B8DB
- C0C4E1
- CCD0E7
- D9DBED
- E5E7F3
- F2F3F9
Sombras
- 7378A8
- 61668F
- 505477
- 404360
- 303249
- 212334
- 131420
- 06070E
- 010102
Tons
- 848ABB
- 8489B5
- 8388AE
- 8387A8
- 8286A1
- 82859B
- 818494
- 81828D
- 808187
Harmonias de cor
Complementar +180°
- 858BC2
Pleated Mauve
- 9C9154
≈ Tupelo Tree
Análoga -30° +30°
- 858BC2
Pleated Mauve
- 6894C0
≈ Kentucky
- 9F82B7
≈ Purple Mountains’ Majesty
Tríade +120° +240°
- 858BC2
Pleated Mauve
- BC7F6A
≈ Western Pink
- 62A07E
≈ Plumosa
Complementar dividida +150° +210°
- 858BC2
Pleated Mauve
- B18757
≈ Allegro
- 809A64
≈ Walking Dead
Tétrade +90° +180° +270°
- 858BC2
Pleated Mauve
- BC7B85
≈ Lipstick Pink
- 9C9154
≈ Tupelo Tree
- 4CA09A
≈ Tourmaline Turquoise
Contraste e acessibilidade
Ag
FailSobre branco
WCAG 3.24:1 · APCA Lc 60
Ag
AASobre preto
WCAG 6.46:1 · APCA Lc 42
Melhor cor de texto: #000000
WCAG 6.46:1 (AA) · APCA Lc 42
Contrast pairs
Trechos de código
CSS
:root {
--pleated-mauve: #858bc2;
--pleated-mauve-rgb: 133 139 194;
--pleated-mauve-oklch: oklch(0.653 0.082 279);
}
.element {
color: var(--pleated-mauve);
background-color: hsl(234 33% 64%);
border-color: oklch(0.653 0.082 279);
}Tailwind CSS v4
@theme {
--color-pleated-mauve: #858bc2;
--color-pleated-mauve-50: #f0f3ff;
--color-pleated-mauve-100: #e2e5ff;
--color-pleated-mauve-200: #cdd1f8;
--color-pleated-mauve-300: #afb3e1;
--color-pleated-mauve-400: #949acf;
--color-pleated-mauve-500: #7a80bc;
--color-pleated-mauve-600: #686d9f;
--color-pleated-mauve-700: #53577f;
--color-pleated-mauve-800: #3b405f;
--color-pleated-mauve-900: #282c42;
--color-pleated-mauve-950: #16192b;
}SCSS
$pleated-mauve: #858bc2;
$pleated-mauve-rgb: 133, 139, 194;
$pleated-mauve-light: mix(#fff, $pleated-mauve, 20%);
$pleated-mauve-dark: mix(#000, $pleated-mauve, 20%);
.element {
color: $pleated-mauve;
box-shadow: 0 0 0 2px rgba($pleated-mauve, 0.35);
}