Color con nombre más cercano · #FE85A0
#FE85A0
Color con nombre más cercano: Strawberry Dreams
#FE85A0 (rgb(254 133 160), hsl(347 98% 76%), oklch(0.758 0.149 7.1)) se parece más al color con nombre Strawberry Dreams. Mira tintes, sombras, armonías, contraste WCAG y APCA, y código CSS, Tailwind v4 y SCSS.
#FE85A0
oklch(0.758 0.149 7.1)
Conversiones de color
- HEX
- #fe85a0
- RGB
- rgb(254 133 160)
- HSL
- hsl(347 98% 76%)
- HWB
- hwb(347 52% 0%)
- OKLCH
- oklch(0.758 0.149 7.1)
- OKLab
- oklab(0.758 0.148 0.018)
- CIE Lab
- lab(70.17 48.87 7.82)
- LCH
- lch(70.17 49.5 9.1)
- CMYK
- cmyk(0% 48% 37% 0%)
Tintes · Sombras · Tonos
Tintes
- FF92A9
- FF9FB2
- FFABBC
- FFB7C5
- FFC3CF
- FFCFD8
- FFDBE2
- FFE7EB
- FFF3F5
Sombras
- DD738B
- BD6176
- 9E5061
- 80404E
- 63303B
- 472129
- 2D1319
- 160609
- 030101
Tonos
- F2859D
- E5869A
- D98696
- CD8593
- C08590
- B4848D
- A7838A
- 9A8386
- 8D8183
Armonías de color
Complementario +180°
- FE85A0
Strawberry Dreams
- 00CBBF
≈ Pristine Oceanic
Análogo -30° +30°
- FE85A0
Strawberry Dreams
- EB89D2
≈ Blushed Bombshell
- FF8C6A
≈ Salmon Orange
Triádico +120° +240°
- FE85A0
Strawberry Dreams
- 97C151
≈ Pesto Genovese
- 66B7FF
≈ Tiān Lán Sky
Complementario dividido +150° +210°
- FE85A0
Strawberry Dreams
- 4CCC8A
≈ Paris Green
- 00C5E8
≈ Caribbean Blue
Tetrádico +90° +180° +270°
- FE85A0
Strawberry Dreams
- CBB021
≈ Sulphur
- 00CBBF
≈ Pristine Oceanic
- 9DA8FF
≈ Widowmaker
Contraste y accesibilidad
Ag
FailSobre blanco
WCAG 2.31:1 · APCA Lc 45
Ag
AAASobre negro
WCAG 9.07:1 · APCA Lc 57
Mejor color de texto: #000000
WCAG 9.07:1 (AAA) · APCA Lc 57
Contrast pairs
Fragmentos de código
CSS
:root {
--strawberry-dreams: #fe85a0;
--strawberry-dreams-rgb: 254 133 160;
--strawberry-dreams-oklch: oklch(0.758 0.149 7.1);
}
.element {
color: var(--strawberry-dreams);
background-color: hsl(347 98% 76%);
border-color: oklch(0.758 0.149 7.1);
}Tailwind CSS v4
@theme {
--color-strawberry-dreams: #fe85a0;
--color-strawberry-dreams-50: #ffe4ec;
--color-strawberry-dreams-100: #ffd4dd;
--color-strawberry-dreams-200: #ffbac7;
--color-strawberry-dreams-300: #f896a7;
--color-strawberry-dreams-400: #e6768f;
--color-strawberry-dreams-500: #d45375;
--color-strawberry-dreams-600: #b34863;
--color-strawberry-dreams-700: #90394f;
--color-strawberry-dreams-800: #6b283b;
--color-strawberry-dreams-900: #4b1b29;
--color-strawberry-dreams-950: #310b17;
}SCSS
$strawberry-dreams: #fe85a0;
$strawberry-dreams-rgb: 254, 133, 160;
$strawberry-dreams-light: mix(#fff, $strawberry-dreams, 20%);
$strawberry-dreams-dark: mix(#000, $strawberry-dreams, 20%);
.element {
color: $strawberry-dreams;
box-shadow: 0 0 0 2px rgba($strawberry-dreams, 0.35);
}