Couleur nommée la plus proche · #7D44E5
#7D44E5
Couleur nommée la plus proche: Hokkaido Lavender
#7D44E5 (rgb(125 68 229), hsl(261 76% 58%), oklch(0.547 0.228 293.7)) est la plus proche de la couleur nommée Hokkaido Lavender. Teintes, ombres, harmonies, contraste WCAG et APCA, et code CSS, Tailwind v4 et SCSS.
#7D44E5
oklch(0.547 0.228 293.7)
Conversions de couleur
- HEX
- #7d44e5
- RGB
- rgb(125 68 229)
- HSL
- hsl(261 76% 58%)
- HWB
- hwb(261 27% 10%)
- OKLCH
- oklch(0.547 0.228 293.7)
- OKLab
- oklab(0.547 0.091 -0.209)
- CIE Lab
- lab(43.44 51.05 -74.1)
- LCH
- lch(43.44 89.99 304.6)
- CMYK
- cmyk(45% 70% 0% 10%)
Teintes · Ombres · Tons
Teintes
- 885BE9
- 9370ED
- 9F83F1
- AC95F4
- B9A7F7
- C6B9FA
- D4CAFC
- E2DCFD
- F0EDFE
Ombres
- 6C3AC7
- 5B30AA
- 4B268E
- 3B1D72
- 2C1458
- 1E0C3F
- 110528
- 050212
- 010003
Tons
- 7C4EDC
- 7C56D2
- 7C5EC8
- 7C64BF
- 7C6AB5
- 7D6FAB
- 7D74A1
- 7E7896
- 7F7C8B
Harmonies de couleurs
Complémentaire +180°
- 7D44E5
Hokkaido Lavender
- 717800
≈ Portuguese Green
Analogue -30° +30°
- 7D44E5
Hokkaido Lavender
- 2560F2
≈ Retro Blue
- AC28BA
≈ Magentleman
Triadique +120° +240°
- 7D44E5
Hokkaido Lavender
- AC5500
≈ Tijolo
- 00846C
≈ Viridis
Complémentaire divisée +150° +210°
- 7D44E5
Hokkaido Lavender
- 906A00
≈ Sassy Olive
- 008916
≈ Lush Garden
Tétradique +90° +180° +270°
- 7D44E5
Hokkaido Lavender
- D30028
≈ Cardinal Rage
- 717800
≈ Portuguese Green
- 008089
≈ Go Alpha
Contraste et accessibilité
Ag
AASur blanc
WCAG 5.48:1 · APCA Lc 77
Ag
FailSur noir
WCAG 3.83:1 · APCA Lc 25
Meilleure couleur de texte: #FFFFFF
WCAG 5.48:1 (AA) · APCA Lc 77
Contrast pairs
Extraits de code
CSS
:root {
--hokkaido-lavender: #7d44e5;
--hokkaido-lavender-rgb: 125 68 229;
--hokkaido-lavender-oklch: oklch(0.547 0.228 293.7);
}
.element {
color: var(--hokkaido-lavender);
background-color: hsl(261 76% 58%);
border-color: oklch(0.547 0.228 293.7);
}Tailwind CSS v4
@theme {
--color-hokkaido-lavender: #7d44e5;
--color-hokkaido-lavender-50: #fae9ff;
--color-hokkaido-lavender-100: #eed9ff;
--color-hokkaido-lavender-200: #dcbfff;
--color-hokkaido-lavender-300: #c29cff;
--color-hokkaido-lavender-400: #a87bff;
--color-hokkaido-lavender-500: #9455ff;
--color-hokkaido-lavender-600: #7d49e0;
--color-hokkaido-lavender-700: #643bb5;
--color-hokkaido-lavender-800: #472b89;
--color-hokkaido-lavender-900: #311d61;
--color-hokkaido-lavender-950: #1e0b43;
}SCSS
$hokkaido-lavender: #7d44e5;
$hokkaido-lavender-rgb: 125, 68, 229;
$hokkaido-lavender-light: mix(#fff, $hokkaido-lavender, 20%);
$hokkaido-lavender-dark: mix(#000, $hokkaido-lavender, 20%);
.element {
color: $hokkaido-lavender;
box-shadow: 0 0 0 2px rgba($hokkaido-lavender, 0.35);
}