Nearest named color · #7D609A
#7D609A
Nearest named color: Passion Flower
#7D609A (rgb(125 96 154), hsl(270 23% 49%), oklch(0.541 0.094 306.5)) is closest to the named color Passion Flower. See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
#7D609A
oklch(0.541 0.094 306.5)
Color conversions
- HEX
- #7d609a
- RGB
- rgb(125 96 154)
- HSL
- hsl(270 23% 49%)
- HWB
- hwb(270 38% 40%)
- OKLCH
- oklch(0.541 0.094 306.5)
- OKLab
- oklab(0.541 0.056 -0.075)
- CIE Lab
- lab(45.51 21.01 -27.38)
- LCH
- lch(45.51 34.51 307.5)
- CMYK
- cmyk(19% 38% 0% 40%)
Tints · Shades · Tones
Tints
- 896FA4
- 967EAE
- A28EB8
- AF9DC2
- BCADCD
- C9BDD7
- D6CDE1
- E4DEEB
- F1EEF5
Shades
- 6C5285
- 5B4571
- 4B385E
- 3B2C4B
- 2C2039
- 1E1527
- 110A17
- 050309
- 010001
Tones
- 7D6398
- 7E6795
- 7E6A93
- 7E6D90
- 7F718E
- 7F748B
- 7F7789
- 7F7A86
- 807D83
Color harmonies
Complementary +180°
- 7D609A
Passion Flower
- 61793A
≈ Mangrove Leaf
Analogous -30° +30°
- 7D609A
Passion Flower
- 616AA5
≈ Twinkle Night
- 915983
≈ Antique Fuchsia
Triadic +120° +240°
- 7D609A
Passion Flower
- 94632D
≈ Retrofit
- 058078
≈ Coelia Greenshade
Split-complementary +150° +210°
- 7D609A
Passion Flower
- 7F6F26
≈ Tarnished Brass
- 3A7F58
≈ Amazon
Tetradic +90° +180° +270°
- 7D609A
Passion Flower
- 9E5A47
≈ Ceramic Brown
- 61793A
≈ Mangrove Leaf
- 0D7C92
≈ Mosaic Blue
Contrast & accessibility
Ag
AAOn white
WCAG 5.23:1 · APCA Lc 76
Ag
FailOn black
WCAG 4.01:1 · APCA Lc 26
Best text color: #FFFFFF
WCAG 5.23:1 (AA) · APCA Lc 76
Contrast pairs
Code snippets
CSS
:root {
--passion-flower: #7d609a;
--passion-flower-rgb: 125 96 154;
--passion-flower-oklch: oklch(0.541 0.094 306.5);
}
.element {
color: var(--passion-flower);
background-color: hsl(270 23% 49%);
border-color: oklch(0.541 0.094 306.5);
}Tailwind CSS v4
@theme {
--color-passion-flower: #7d609a;
--color-passion-flower-50: #fdeeff;
--color-passion-flower-100: #f1e0ff;
--color-passion-flower-200: #e0caf4;
--color-passion-flower-300: #c5abdd;
--color-passion-flower-400: #ac90ca;
--color-passion-flower-500: #9675b7;
--color-passion-flower-600: #7f639b;
--color-passion-flower-700: #664f7c;
--color-passion-flower-800: #4a3a5d;
--color-passion-flower-900: #332841;
--color-passion-flower-950: #1f1629;
}SCSS
$passion-flower: #7d609a;
$passion-flower-rgb: 125, 96, 154;
$passion-flower-light: mix(#fff, $passion-flower, 20%);
$passion-flower-dark: mix(#000, $passion-flower, 20%);
.element {
color: $passion-flower;
box-shadow: 0 0 0 2px rgba($passion-flower, 0.35);
}