Color con nombre más cercano · #F769A3
#F769A3
Color con nombre más cercano: Fugitive Flamingo
#F769A3 (rgb(247 105 163), hsl(335 90% 69%), oklch(0.712 0.183 357.3)) se parece más al color con nombre Fugitive Flamingo. Mira tintes, sombras, armonías, contraste WCAG y APCA, y código CSS, Tailwind v4 y SCSS.
#F769A3
oklch(0.712 0.183 357.3)
Conversiones de color
- HEX
- #f769a3
- RGB
- rgb(247 105 163)
- HSL
- hsl(335 90% 69%)
- HWB
- hwb(335 41% 3%)
- OKLCH
- oklch(0.712 0.183 357.3)
- OKLab
- oklab(0.712 0.182 -0.009)
- CIE Lab
- lab(64.19 59.32 -2.58)
- LCH
- lch(64.19 59.37 357.5)
- CMYK
- cmyk(0% 57% 34% 3%)
Tintes · Sombras · Tonos
Tintes
- FA7AAC
- FC8AB5
- FF99BE
- FFA8C7
- FFB7D0
- FFC6D9
- FFD4E3
- FFE2EC
- FFF1F5
Sombras
- D75A8D
- B74C78
- 993E63
- 7C314F
- 60243C
- 45182A
- 2C0C19
- 15040A
- 030001
Tonos
- EC6D9F
- E1719C
- D57498
- CA7795
- BE7991
- B27B8E
- A67D8A
- 9A7E87
- 8D7F83
Armonías de color
Complementario +180°
- F769A3
Fugitive Flamingo
- 00BCA1
≈ First Post
Análogo -30° +30°
- F769A3
Fugitive Flamingo
- DC73DC
≈ Hibiscus Pop
- FF6C60
≈ Manila Sunset
Triádico +120° +240°
- F769A3
Fugitive Flamingo
- 9BAE00
≈ Elysia Chlorotica
- 00AEF6
≈ Democrat
Complementario dividido +150° +210°
- F769A3
Fugitive Flamingo
- 3CBF59
≈ Vegan Mastermind
- 00B7C9
≈ Lago Blue
Tetrádico +90° +180° +270°
- F769A3
Fugitive Flamingo
- C99B00
≈ Molten Bronze
- 00BCA1
≈ First Post
- 789DFF
≈ Periwinkle Blue
Contraste y accesibilidad
Ag
FailSobre blanco
WCAG 2.79:1 · APCA Lc 53
Ag
AAASobre negro
WCAG 7.50:1 · APCA Lc 49
Mejor color de texto: #000000
WCAG 7.50:1 (AAA) · APCA Lc 49
Contrast pairs
Fragmentos de código
CSS
:root {
--fugitive-flamingo: #f769a3;
--fugitive-flamingo-rgb: 247 105 163;
--fugitive-flamingo-oklch: oklch(0.712 0.183 357.3);
}
.element {
color: var(--fugitive-flamingo);
background-color: hsl(335 90% 69%);
border-color: oklch(0.712 0.183 357.3);
}Tailwind CSS v4
@theme {
--color-fugitive-flamingo: #f769a3;
--color-fugitive-flamingo-50: #ffe0f4;
--color-fugitive-flamingo-100: #ffcfe6;
--color-fugitive-flamingo-200: #ffb3d2;
--color-fugitive-flamingo-300: #ff8db5;
--color-fugitive-flamingo-400: #ef699f;
--color-fugitive-flamingo-500: #dd4187;
--color-fugitive-flamingo-600: #bb3972;
--color-fugitive-flamingo-700: #962d5c;
--color-fugitive-flamingo-800: #6f1f45;
--color-fugitive-flamingo-900: #4f1530;
--color-fugitive-flamingo-950: #34051c;
}SCSS
$fugitive-flamingo: #f769a3;
$fugitive-flamingo-rgb: 247, 105, 163;
$fugitive-flamingo-light: mix(#fff, $fugitive-flamingo, 20%);
$fugitive-flamingo-dark: mix(#000, $fugitive-flamingo, 20%);
.element {
color: $fugitive-flamingo;
box-shadow: 0 0 0 2px rgba($fugitive-flamingo, 0.35);
}