Couleur nommée la plus proche · #576290
#576290
Couleur nommée la plus proche: Wizard’s Potion
#576290 (rgb(87 98 144), hsl(228 25% 45%), oklch(0.506 0.075 273.2)) est la plus proche de la couleur nommée Wizard’s Potion. Teintes, ombres, harmonies, contraste WCAG et APCA, et code CSS, Tailwind v4 et SCSS.
#576290
oklch(0.506 0.075 273.2)
Conversions de couleur
- HEX
- #576290
- RGB
- rgb(87 98 144)
- HSL
- hsl(228 25% 45%)
- HWB
- hwb(228 34% 44%)
- OKLCH
- oklch(0.506 0.075 273.2)
- OKLab
- oklab(0.506 0.004 -0.074)
- CIE Lab
- lab(42.1 4.95 -27.04)
- LCH
- lch(42.1 27.49 280.4)
- CMYK
- cmyk(40% 32% 0% 44%)
Teintes · Ombres · Tons
Teintes
- 66719B
- 7680A6
- 868FB1
- 969EBC
- A7AEC7
- B8BED2
- C9CEDE
- DBDEE9
- EDEEF4
Ombres
- 4B547D
- 3E476A
- 333A57
- 272D45
- 1C2134
- 121624
- 080B15
- 030307
- 000001
Tons
- 5B658F
- 5F688D
- 636B8C
- 676E8A
- 6B7189
- 6F7487
- 737786
- 787A84
- 7C7D82
Harmonies de couleurs
Complémentaire +180°
- 576290
Wizard’s Potion
- 74642F
≈ Himalaya
Analogue -30° +30°
- 576290
Wizard’s Potion
- 3D6A8D
≈ Rainy Lake
- 6E5A88
≈ Emperor Jewel
Triadique +120° +240°
- 576290
Wizard’s Potion
- 8A5549
≈ Potter’s Rock
- 417251
≈ Fairway
Complémentaire divisée +150° +210°
- 576290
Wizard’s Potion
- 835B36
≈ Rubber
- 5D6C3B
≈ Globe Artichoke
Tétradique +90° +180° +270°
- 576290
Wizard’s Potion
- 895361
≈ Berry Smoothie
- 74642F
≈ Himalaya
- 287369
≈ Advantageous
Contraste et accessibilité
Ag
AASur blanc
WCAG 5.90:1 · APCA Lc 80
Ag
FailSur noir
WCAG 3.55:1 · APCA Lc 22
Meilleure couleur de texte: #FFFFFF
WCAG 5.90:1 (AA) · APCA Lc 80
Contrast pairs
Extraits de code
CSS
:root {
--wizard-s-potion: #576290;
--wizard-s-potion-rgb: 87 98 144;
--wizard-s-potion-oklch: oklch(0.506 0.075 273.2);
}
.element {
color: var(--wizard-s-potion);
background-color: hsl(228 25% 45%);
border-color: oklch(0.506 0.075 273.2);
}Tailwind CSS v4
@theme {
--color-wizard-s-potion: #576290;
--color-wizard-s-potion-50: #eff4ff;
--color-wizard-s-potion-100: #e0e7ff;
--color-wizard-s-potion-200: #cbd2f5;
--color-wizard-s-potion-300: #acb5de;
--color-wizard-s-potion-400: #909ccb;
--color-wizard-s-potion-500: #7683b8;
--color-wizard-s-potion-600: #646f9b;
--color-wizard-s-potion-700: #50597d;
--color-wizard-s-potion-800: #39415d;
--color-wizard-s-potion-900: #272d41;
--color-wizard-s-potion-950: #151a29;
}SCSS
$wizard-s-potion: #576290;
$wizard-s-potion-rgb: 87, 98, 144;
$wizard-s-potion-light: mix(#fff, $wizard-s-potion, 20%);
$wizard-s-potion-dark: mix(#000, $wizard-s-potion, 20%);
.element {
color: $wizard-s-potion;
box-shadow: 0 0 0 2px rgba($wizard-s-potion, 0.35);
}