Color con nombre · #4D52DE
Dark Soft Violet
Dark Soft Violet es #4D52DE: rgb(77 82 222), hsl(238 69% 59%), oklch(0.522 0.209 274.9). Mira tintes, sombras, armonías, contraste WCAG y APCA, y código CSS, Tailwind v4 y SCSS.
What does Blue mean? → · Dark Soft Violet color name →
#4D52DE
oklch(0.522 0.209 274.9)
Conversiones de color
- HEX
- #4d52de
- RGB
- rgb(77 82 222)
- HSL
- hsl(238 69% 59%)
- HWB
- hwb(238 30% 13%)
- OKLCH
- oklch(0.522 0.209 274.9)
- OKLab
- oklab(0.522 0.018 -0.208)
- CIE Lab
- lab(41.42 32.52 -73.66)
- LCH
- lch(41.42 80.52 293.8)
- CMYK
- cmyk(65% 63% 0% 13%)
Tintes · Sombras · Tonos
Tintes
- 5B66E3
- 6A78E8
- 7B8AEC
- 8C9BF0
- 9EACF4
- B0BDF7
- C3CDFA
- D7DEFC
- EBEEFE
Sombras
- 4246C1
- 373BA5
- 2C2F89
- 22256F
- 181A55
- 0F113D
- 070826
- 020212
- 000002
Tonos
- 5059D5
- 5560CD
- 5965C4
- 5E6ABB
- 636FB2
- 6873A8
- 6E779F
- 747A95
- 7A7D8B
Armonías de color
Complementario +180°
- 4D52DE
Dark Soft Violet
- 7D6800
≈ Arousing Alligator
Análogo -30° +30°
- 4D52DE
Dark Soft Violet
- 006FAF
≈ Daphne
- 863AC7
≈ Dreamscape Purple
Triádico +120° +240°
- 4D52DE
Dark Soft Violet
- BB2E00
≈ Dropped Brick
- 007E47
≈ Picture Book Green
Complementario dividido +150° +210°
- 4D52DE
Dark Soft Violet
- 975900
≈ Sepia Wash
- 587500
≈ Topiary Green
Tetrádico +90° +180° +270°
- 4D52DE
Dark Soft Violet
- C10359
≈ Velvet Magic
- 7D6800
≈ Arousing Alligator
- 007A70
≈ Pond Moss
Contraste y accesibilidad
Ag
AASobre blanco
WCAG 5.87:1 · APCA Lc 79
Ag
FailSobre negro
WCAG 3.57:1 · APCA Lc 23
Mejor color de texto: #FFFFFF
WCAG 5.87:1 (AA) · APCA Lc 79
Contrast pairs
Fragmentos de código
CSS
:root {
--dark-soft-violet: #4d52de;
--dark-soft-violet-rgb: 77 82 222;
--dark-soft-violet-oklch: oklch(0.522 0.209 274.9);
}
.element {
color: var(--dark-soft-violet);
background-color: hsl(238 69% 59%);
border-color: oklch(0.522 0.209 274.9);
}Tailwind CSS v4
@theme {
--color-dark-soft-violet: #4d52de;
--color-dark-soft-violet-50: #e5f1ff;
--color-dark-soft-violet-100: #d6e2ff;
--color-dark-soft-violet-200: #beccff;
--color-dark-soft-violet-300: #9dabff;
--color-dark-soft-violet-400: #7d8eff;
--color-dark-soft-violet-500: #646eff;
--color-dark-soft-violet-600: #555ee2;
--color-dark-soft-violet-700: #434bb6;
--color-dark-soft-violet-800: #2d3789;
--color-dark-soft-violet-900: #1e2661;
--color-dark-soft-violet-950: #0f1343;
}SCSS
$dark-soft-violet: #4d52de;
$dark-soft-violet-rgb: 77, 82, 222;
$dark-soft-violet-light: mix(#fff, $dark-soft-violet, 20%);
$dark-soft-violet-dark: mix(#000, $dark-soft-violet, 20%);
.element {
color: $dark-soft-violet;
box-shadow: 0 0 0 2px rgba($dark-soft-violet, 0.35);
}