Couleur nommée la plus proche · #FF9AA1
#FF9AA1
Couleur nommée la plus proche: Strawberry Frappé
#FF9AA1 (rgb(255 154 161), hsl(356 100% 80%), oklch(0.792 0.121 15.7)) est la plus proche de la couleur nommée Strawberry Frappé. Teintes, ombres, harmonies, contraste WCAG et APCA, et code CSS, Tailwind v4 et SCSS.
#FF9AA1
oklch(0.792 0.121 15.7)
Conversions de couleur
- 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%)
Teintes · Ombres · Tons
Teintes
- FFA4AA
- FFAFB3
- FFB9BD
- FFC3C6
- FFCDCF
- FFD7D9
- FFE1E2
- FFEBEC
- FFF5F5
Ombres
- DE858B
- BE7176
- 9E5E62
- 804B4E
- 63393C
- 48272A
- 2E1719
- 160909
- 030101
Tons
- F2989E
- E6969A
- D99397
- CD9194
- C08E91
- B38C8D
- A7898A
- 9A8687
- 8D8383
Harmonies de couleurs
Complémentaire +180°
- FF9AA1
Strawberry Frappé
- 3ED3D4
≈ Medium Turquoise
Analogue -30° +30°
- FF9AA1
Strawberry Frappé
- F39BCC
≈ Pearly Pink
- FBA277
≈ Butternut
Triadique +120° +240°
- FF9AA1
Strawberry Frappé
- 98CD7D
≈ Jade Lime
- 8DBEFF
≈ Scenic Water
Complémentaire divisée +150° +210°
- FF9AA1
Strawberry Frappé
- 64D4A9
≈ Crystal Gem
- 55CBF6
≈ Thor’s Thunder
Tétradique +90° +180° +270°
- FF9AA1
Strawberry Frappé
- C6C05D
≈ Sulphur Yellow
- 3ED3D4
≈ Medium Turquoise
- B5B1FF
≈ Winterspring Lilac
Contraste et accessibilité
Ag
FailSur blanc
WCAG 2.02:1 · APCA Lc 39
Ag
AAASur noir
WCAG 10.38:1 · APCA Lc 63
Meilleure couleur de texte: #000000
WCAG 10.38:1 (AAA) · APCA Lc 63
Contrast pairs
Extraits de code
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);
}