Nearest named color · #626095
#626095
Nearest named color: Wizard’s Potion
#626095 (rgb(98 96 149), hsl(242 22% 48%), oklch(0.514 0.083 284.8)) is closest to the named color Wizard’s Potion. See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
#626095
oklch(0.514 0.083 284.8)
Color conversions
- HEX
- #626095
- RGB
- rgb(98 96 149)
- HSL
- hsl(242 22% 48%)
- HWB
- hwb(242 38% 42%)
- OKLCH
- oklch(0.514 0.083 284.8)
- OKLab
- oklab(0.514 0.021 -0.08)
- CIE Lab
- lab(42.65 10.81 -29.09)
- LCH
- lch(42.65 31.03 290.4)
- CMYK
- cmyk(34% 36% 0% 42%)
Tints · Shades · Tones
Tints
- 706FA0
- 7F7EAA
- 8E8EB5
- 9D9DC0
- ADADCA
- BDBDD5
- CDCDDF
- DDDEEA
- EEEEF4
Shades
- 545281
- 47456D
- 3A385A
- 2D2C48
- 212037
- 161526
- 0B0A16
- 030308
- 000001
Tones
- 656393
- 686791
- 6A6A8F
- 6D6D8E
- 70718B
- 737489
- 777787
- 7A7A85
- 7D7D82
Color harmonies
Complementary +180°
- 626095
Wizard’s Potion
- 6E6A2C
≈ Safari Green
Analogous -30° +30°
- 626095
Wizard’s Potion
- 456996
≈ Queen Blue
- 795888
≈ Champion
Triadic +120° +240°
- 626095
Wizard’s Potion
- 8F573E
≈ Chōjicha Brown
- 31765B
≈ Scouring Rush
Split-complementary +150° +210°
- 626095
Wizard’s Potion
- 83602B
≈ Bronze Brown
- 527240
≈ Artichoke Green
Tetradic +90° +180° +270°
- 626095
Wizard’s Potion
- 905258
≈ Fragrant Cherry
- 6E6A2C
≈ Safari Green
- 137676
≈ Prismarine
Contrast & accessibility
Ag
AAOn white
WCAG 5.79:1 · APCA Lc 79
Ag
FailOn black
WCAG 3.62:1 · APCA Lc 23
Best text color: #FFFFFF
WCAG 5.79:1 (AA) · APCA Lc 79
Contrast pairs
Code snippets
CSS
:root {
--wizard-s-potion: #626095;
--wizard-s-potion-rgb: 98 96 149;
--wizard-s-potion-oklch: oklch(0.514 0.083 284.8);
}
.element {
color: var(--wizard-s-potion);
background-color: hsl(242 22% 48%);
border-color: oklch(0.514 0.083 284.8);
}Tailwind CSS v4
@theme {
--color-wizard-s-potion: #626095;
--color-wizard-s-potion-50: #f3f2ff;
--color-wizard-s-potion-100: #e5e4ff;
--color-wizard-s-potion-200: #d1d0f7;
--color-wizard-s-potion-300: #b4b2e1;
--color-wizard-s-potion-400: #9998ce;
--color-wizard-s-potion-500: #807ebb;
--color-wizard-s-potion-600: #6c6b9e;
--color-wizard-s-potion-700: #57567f;
--color-wizard-s-potion-800: #3e3f5e;
--color-wizard-s-potion-900: #2b2b42;
--color-wizard-s-potion-950: #18182b;
}SCSS
$wizard-s-potion: #626095;
$wizard-s-potion-rgb: 98, 96, 149;
$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);
}