Color con nombre · #F1CA90
Sweet!
Sweet! es #F1CA90: rgb(241 202 144), hsl(36 78% 75%), oklch(0.859 0.087 77.1). Mira tintes, sombras, armonías, contraste WCAG y APCA, y código CSS, Tailwind v4 y SCSS.
What does Orange mean? → · Sweet! color name →
#F1CA90
oklch(0.859 0.087 77.1)
Conversiones de color
- HEX
- #f1ca90
- RGB
- rgb(241 202 144)
- HSL
- hsl(36 78% 75%)
- HWB
- hwb(36 56% 5%)
- OKLCH
- oklch(0.859 0.087 77.1)
- OKLab
- oklab(0.859 0.019 0.084)
- CIE Lab
- lab(83.76 8.62 34.39)
- LCH
- lch(83.76 35.45 75.9)
- CMYK
- cmyk(0% 16% 40% 5%)
Tintes · Sombras · Tonos
Tintes
- F3CF9C
- F4D5A7
- F6DAB2
- F7DFBD
- F8E5C8
- FAEAD3
- FBEFDE
- FCF5E9
- FEFAF4
Sombras
- D2AF7D
- B3956A
- 957C57
- 796445
- 5D4D34
- 433724
- 2B2215
- 140F07
- 030201
Tonos
- E5C28F
- DABB8E
- CEB38D
- C3AC8B
- B7A58A
- AC9D88
- A19686
- 968F84
- 8B8782
Armonías de color
Complementario +180°
- F1CA90
Sweet!
- B4D3FF
≈ Ice Cold Stare
Análogo -30° +30°
- F1CA90
Sweet!
- FFC1A3
≈ Sweet Apricot
- D7D592
≈ Mellow Green
Triádico +120° +240°
- F1CA90
Sweet!
- 89E3E4
≈ Aqua Fiesta
- E8C0F7
≈ Jane Purple
Complementario dividido +150° +210°
- F1CA90
Sweet!
- 92DDFD
≈ Gas Giant
- CDCAFF
≈ Lavender Blue
Tetrádico +90° +180° +270°
Contraste y accesibilidad
Ag
FailSobre blanco
WCAG 1.54:1 · APCA Lc 25
Ag
AAASobre negro
WCAG 13.59:1 · APCA Lc 78
Mejor color de texto: #000000
WCAG 13.59:1 (AAA) · APCA Lc 78
Contrast pairs
Fragmentos de código
CSS
:root {
--sweet: #f1ca90;
--sweet-rgb: 241 202 144;
--sweet-oklch: oklch(0.859 0.087 77.1);
}
.element {
color: var(--sweet);
background-color: hsl(36 78% 75%);
border-color: oklch(0.859 0.087 77.1);
}Tailwind CSS v4
@theme {
--color-sweet: #f1ca90;
--color-sweet-50: #fff3da;
--color-sweet-100: #f8e5c8;
--color-sweet-200: #e8d1ab;
--color-sweet-300: #cfb385;
--color-sweet-400: #bb9863;
--color-sweet-500: #a67e3f;
--color-sweet-600: #8c6b36;
--color-sweet-700: #71562b;
--color-sweet-800: #543e1e;
--color-sweet-900: #3a2b13;
--color-sweet-950: #241805;
}SCSS
$sweet: #f1ca90;
$sweet-rgb: 241, 202, 144;
$sweet-light: mix(#fff, $sweet, 20%);
$sweet-dark: mix(#000, $sweet, 20%);
.element {
color: $sweet;
box-shadow: 0 0 0 2px rgba($sweet, 0.35);
}