Colore con nome · #FF4681
Sasquatch Socks
Sasquatch Socks è #FF4681: rgb(255 70 129), hsl(341 100% 64%), oklch(0.677 0.222 6.5). Scopri tinte, ombre, armonie, contrasto WCAG e APCA e codice CSS, Tailwind v4 e SCSS.
What does Red mean? → · Sasquatch Socks color name →
#FF4681
oklch(0.677 0.222 6.5)
Conversioni di colore
- HEX
- #ff4681
- RGB
- rgb(255 70 129)
- HSL
- hsl(341 100% 64%)
- HWB
- hwb(341 27% 0%)
- OKLCH
- oklch(0.677 0.222 6.5)
- OKLab
- oklab(0.677 0.221 0.025)
- CIE Lab
- lab(59.86 72.29 11.15)
- LCH
- lch(59.86 73.14 8.8)
- CMYK
- cmyk(0% 73% 49% 0%)
Tinte · Ombre · Toni
Tinte
- FF5F8D
- FF7499
- FF87A5
- FF9AB2
- FFABBE
- FFBCCB
- FFCDD8
- FFDEE5
- FFEFF2
Ombre
- DE3C6F
- BE325E
- 9E284E
- 801E3E
- 63152E
- 480D1F
- 2E0512
- 160206
- 030001
Toni
- F45181
- E85A81
- DC6281
- D06881
- C46D81
- B77281
- AA7680
- 9D7A80
- 8F7D80
Armonie di colore
Complementare +180°
- FF4681
Sasquatch Socks
- 00AEA3
≈ Cozumel
Analogo -30° +30°
- FF4681
Sasquatch Socks
- E652C9
≈ Barbiecore
- FF551F
≈ Smashing Pumpkins
Triadico +120° +240°
- FF4681
Sasquatch Socks
- 7CA900
≈ Green Envy
- 009DFC
≈ Blue Nebula
Complementare divisa +150° +210°
- FF4681
Sasquatch Socks
- 00B46C
≈ Green Mana
- 00A9C7
≈ Gummy Dolphins
Tetradico +90° +180° +270°
- FF4681
Sasquatch Socks
- B09600
≈ Sunken Gold
- 00AEA3
≈ Cozumel
- 7E89FF
≈ Lavender Blue Shadow
Contrasto e accessibilità
Ag
FailSu bianco
WCAG 3.25:1 · APCA Lc 59
Ag
AASu nero
WCAG 6.44:1 · APCA Lc 43
Miglior colore del testo: #000000
WCAG 6.44:1 (AA) · APCA Lc 43
Contrast pairs
Frammenti di codice
CSS
:root {
--sasquatch-socks: #ff4681;
--sasquatch-socks-rgb: 255 70 129;
--sasquatch-socks-oklch: oklch(0.677 0.222 6.5);
}
.element {
color: var(--sasquatch-socks);
background-color: hsl(341 100% 64%);
border-color: oklch(0.677 0.222 6.5);
}Tailwind CSS v4
@theme {
--color-sasquatch-socks: #ff4681;
--color-sasquatch-socks-50: #ffdbe8;
--color-sasquatch-socks-100: #ffc9d9;
--color-sasquatch-socks-200: #ffaac1;
--color-sasquatch-socks-300: #ff80a1;
--color-sasquatch-socks-400: #ff5689;
--color-sasquatch-socks-500: #f20e6e;
--color-sasquatch-socks-600: #cc165d;
--color-sasquatch-socks-700: #a5134a;
--color-sasquatch-socks-800: #7b0b39;
--color-sasquatch-socks-900: #570827;
--color-sasquatch-socks-950: #3a0015;
}SCSS
$sasquatch-socks: #ff4681;
$sasquatch-socks-rgb: 255, 70, 129;
$sasquatch-socks-light: mix(#fff, $sasquatch-socks, 20%);
$sasquatch-socks-dark: mix(#000, $sasquatch-socks, 20%);
.element {
color: $sasquatch-socks;
box-shadow: 0 0 0 2px rgba($sasquatch-socks, 0.35);
}