Nearest named color · #F793AF
#F793AF
Nearest named color: Rock’n’Rose
#F793AF (rgb(247 147 175), hsl(343 86% 77%), oklch(0.775 0.124 2.3)) is closest to the named color Rock’n’Rose. See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
#F793AF
oklch(0.775 0.124 2.3)
Color conversions
- HEX
- #f793af
- RGB
- rgb(247 147 175)
- HSL
- hsl(343 86% 77%)
- HWB
- hwb(343 58% 3%)
- OKLCH
- oklch(0.775 0.124 2.3)
- OKLab
- oklab(0.775 0.124 0.005)
- CIE Lab
- lab(72.37 40.99 2.46)
- LCH
- lch(72.37 41.07 3.4)
- CMYK
- cmyk(0% 40% 29% 3%)
Tints · Shades · Tones
Tints
- F99EB7
- FBA9BF
- FCB4C6
- FDBFCE
- FECAD6
- FFD4DE
- FFDFE6
- FFEAEF
- FFF4F7
Shades
- D77F98
- B76C81
- 99596B
- 7C4756
- 603641
- 45252E
- 2C161C
- 15080B
- 030101
Tones
- EB92AA
- DF90A5
- D48EA1
- C88D9C
- BC8B97
- B08992
- A4878E
- 988589
- 8C8285
Color harmonies
Complementary +180°
- F793AF
Rock’n’Rose
- 3DCFBC
≈ Bianchi Green
Analogous -30° +30°
- F793AF
Rock’n’Rose
- E497D9
≈ Love Dust
- FB9783
≈ Parma Ham
Triadic +120° +240°
- F793AF
Rock’n’Rose
- A8C265
≈ Jungle Juice
- 68BFFE
≈ Broken Blue
Split-complementary +150° +210°
- F793AF
Rock’n’Rose
- 74CD8F
≈ Serengeti Green
- 35CAE4
≈ Picnic Day Sky
Tetradic +90° +180° +270°
- F793AF
Rock’n’Rose
- D2B34F
≈ Gold Gleam
- 3DCFBC
≈ Bianchi Green
- 9DB1FF
≈ Widowmaker
Contrast & accessibility
Ag
FailOn white
WCAG 2.15:1 · APCA Lc 42
Ag
AAAOn black
WCAG 9.74:1 · APCA Lc 60
Best text color: #000000
WCAG 9.74:1 (AAA) · APCA Lc 60
Contrast pairs
Code snippets
CSS
:root {
--rock-n-rose: #f793af;
--rock-n-rose-rgb: 247 147 175;
--rock-n-rose-oklch: oklch(0.775 0.124 2.3);
}
.element {
color: var(--rock-n-rose);
background-color: hsl(343 86% 77%);
border-color: oklch(0.775 0.124 2.3);
}Tailwind CSS v4
@theme {
--color-rock-n-rose: #f793af;
--color-rock-n-rose-50: #ffe7f1;
--color-rock-n-rose-100: #ffd7e3;
--color-rock-n-rose-200: #ffbfce;
--color-rock-n-rose-300: #ee9db0;
--color-rock-n-rose-400: #da7e98;
--color-rock-n-rose-500: #c75f7f;
--color-rock-n-rose-600: #a8516c;
--color-rock-n-rose-700: #874056;
--color-rock-n-rose-800: #642e40;
--color-rock-n-rose-900: #461f2c;
--color-rock-n-rose-950: #2d0f19;
}SCSS
$rock-n-rose: #f793af;
$rock-n-rose-rgb: 247, 147, 175;
$rock-n-rose-light: mix(#fff, $rock-n-rose, 20%);
$rock-n-rose-dark: mix(#000, $rock-n-rose, 20%);
.element {
color: $rock-n-rose;
box-shadow: 0 0 0 2px rgba($rock-n-rose, 0.35);
}