#F2969F#F2969F
#F2969F es un color claro y moderadamente saturado de la familia rojo. Luminancia relativa 0.432; OKLCH L 77.0% C 0.111 H 13.7°. El mejor color de texto es #000000 con contraste 9.64:1 (cumple WCAG AA).
Valores del color
| HEX | #F2969F |
|---|---|
| RGB | rgb(242, 150, 159) |
| HSL | hsl(354, 78%, 77%) |
| HSV | hsv(354, 38%, 95%) |
| CMYK | cmyk(0%, 38%, 34.3%, 5.1%) |
| CIE-LAB | lab(71.69, 35.60, 10.01) |
| CIE-LCH | lch(71.69, 36.98, 15.70°) |
| OKLab | oklab(76.96% 0.1079 0.0262) |
| OKLCH | oklch(76.96% 0.111 13.7) |
| XYZ | xyz(53.7844, 43.1973, 38.2993) |
| Luminance | 0.4319 (WCAG relative) |
| Temperature | warm |
| Family | red |
Colores con nombre más cercanos
Rose Pink
#F7879A
ΔE00 4.00
Pig Pink
#E78EA5
ΔE00 5.21
Blush Pink
#FE828C
ΔE00 5.41
Dusty Pink (survey)
#D58A94
ΔE00 5.74
Faded Pink
#DE9DAC
ΔE00 5.94
Rosa
#FE86A4
ΔE00 5.96
Escalas perceptuales
Sombras
Matices
Tonos
OKLCH scale
Armonías de color
complementary
#F2969F #96F2E9
analogous
#F296CD #F2969F #F2BB96
triadic
#F2969F #9FF296 #969FF2
tetradic
#F2969F #CDF296 #96F2E9 #BB96F2
square
#F2969F #CDF296 #96F2E9 #BB96F2
split-complementary
#F2969F #96F2BB #96CDF2
monochromatic
#E5293B #EB606D #F2969F #F9CCD1 #FCE4E6
Accesibilidad y contraste
On white
2.18
#F2969F on #FFFFFF
AA ✗AA large ✗AAA ✗
On black
9.64
#F2969F on #000000
AA ✓AA large ✓AAA ✓
Mejor color de texto
#000000 on #F2969F
9.64:1 — WCAG AA (texto normal) cumple
Matriz de contraste
| fg \ bg | ##F2969F | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##F2969F | 1.00 | 2.18 | 9.64 | 9.64 |
| #FFFFFF | 2.18 | 1.00 | 21.00 | 21.00 |
| #000000 | 9.64 | 21.00 | 1.00 | 1.00 |
| ##000000 | 9.64 | 21.00 | 1.00 | 1.00 |
Vista previa de daltonismo
Protanopia (red-blind)
#A7A59F
Deuteranopia (green-blind)
#BDB69D
Tritanopia (blue-blind)
#FF8D99
Achromatopsia (no color)
#B0B0B0
Tokens de diseño y código
CSS
--color: #f2969f; /* rgb */ color: rgb(242, 150, 159); /* oklch */ color: oklch(77.0% 0.111 13.7);
Tailwind
colors: {
custom: {
50: '#f9b6bb',
500: '#f2969f',
950: '#000000',
},
}SCSS
$custom: #f2969f; $custom-light: #f9b6bb; $custom-dark: #000000;
JSON
{
"hex": "#f2969f",
"rgb": {
"r": 242,
"g": 150,
"b": 159
},
"hsl": {
"h": 354.13,
"s": 77.966,
"l": 76.863
},
"oklch": {
"l": 0.7696,
"c": 0.11108,
"h": 13.7
},
"luminance": 0.43193
}Semantic roles & 50–950 ramp
primary
#F2969F
secondary
#D8F3F1
accent
#DAC60B
background
#FFFBFB
surface
#FFF6F6
border
#D7D0D0
text
#181111
muted
#868080
Laboratorio de vista previa
Laboratorio de vista previa → · Comprobador de contraste → · Generador de paletas →