Color con nombre más cercano · #FF9AA1
#FF9AA1
Color con nombre más cercano: Strawberry Frappé
#FF9AA1 (rgb(255 154 161), hsl(356 100% 80%), oklch(0.792 0.121 15.7)) se parece más al color con nombre Strawberry Frappé. Mira tintes, sombras, armonías, contraste WCAG y APCA, y código CSS, Tailwind v4 y SCSS.
#FF9AA1
oklch(0.792 0.121 15.7)
Conversiones de color
- HEX
- #ff9aa1
- RGB
- rgb(255 154 161)
- HSL
- hsl(356 100% 80%)
- HWB
- hwb(356 60% 0%)
- OKLCH
- oklch(0.792 0.121 15.7)
- OKLab
- oklab(0.792 0.117 0.033)
- CIE Lab
- lab(74.56 39.24 13.42)
- LCH
- lch(74.56 41.47 18.9)
- CMYK
- cmyk(0% 40% 37% 0%)
Tintes · Sombras · Tonos
Tintes
- FFA4AA
- FFAFB3
- FFB9BD
- FFC3C6
- FFCDCF
- FFD7D9
- FFE1E2
- FFEBEC
- FFF5F5
Sombras
- DE858B
- BE7176
- 9E5E62
- 804B4E
- 63393C
- 48272A
- 2E1719
- 160909
- 030101
Tonos
- F2989E
- E6969A
- D99397
- CD9194
- C08E91
- B38C8D
- A7898A
- 9A8687
- 8D8383
Armonías de color
Complementario +180°
- FF9AA1
Strawberry Frappé
- 3ED3D4
≈ Medium Turquoise
Análogo -30° +30°
- FF9AA1
Strawberry Frappé
- F39BCC
≈ Pearly Pink
- FBA277
≈ Butternut
Triádico +120° +240°
- FF9AA1
Strawberry Frappé
- 98CD7D
≈ Jade Lime
- 8DBEFF
≈ Scenic Water
Complementario dividido +150° +210°
- FF9AA1
Strawberry Frappé
- 64D4A9
≈ Crystal Gem
- 55CBF6
≈ Thor’s Thunder
Tetrádico +90° +180° +270°
- FF9AA1
Strawberry Frappé
- C6C05D
≈ Sulphur Yellow
- 3ED3D4
≈ Medium Turquoise
- B5B1FF
≈ Winterspring Lilac
Contraste y accesibilidad
Ag
FailSobre blanco
WCAG 2.02:1 · APCA Lc 39
Ag
AAASobre negro
WCAG 10.38:1 · APCA Lc 63
Mejor color de texto: #000000
WCAG 10.38:1 (AAA) · APCA Lc 63
Contrast pairs
Fragmentos de código
CSS
:root {
--strawberry-frappe: #ff9aa1;
--strawberry-frappe-rgb: 255 154 161;
--strawberry-frappe-oklch: oklch(0.792 0.121 15.7);
}
.element {
color: var(--strawberry-frappe);
background-color: hsl(356 100% 80%);
border-color: oklch(0.792 0.121 15.7);
}Tailwind CSS v4
@theme {
--color-strawberry-frappe: #ff9aa1;
--color-strawberry-frappe-50: #ffe8e8;
--color-strawberry-frappe-100: #ffd8d9;
--color-strawberry-frappe-200: #ffc0c1;
--color-strawberry-frappe-300: #ef9ea0;
--color-strawberry-frappe-400: #dc7f86;
--color-strawberry-frappe-500: #c9616b;
--color-strawberry-frappe-600: #aa525b;
--color-strawberry-frappe-700: #894248;
--color-strawberry-frappe-800: #652f36;
--color-strawberry-frappe-900: #472025;
--color-strawberry-frappe-950: #2e0f13;
}SCSS
$strawberry-frappe: #ff9aa1;
$strawberry-frappe-rgb: 255, 154, 161;
$strawberry-frappe-light: mix(#fff, $strawberry-frappe, 20%);
$strawberry-frappe-dark: mix(#000, $strawberry-frappe, 20%);
.element {
color: $strawberry-frappe;
box-shadow: 0 0 0 2px rgba($strawberry-frappe, 0.35);
}