Couleur nommée · #FBCA69
Sunspark
Sunspark correspond à #FBCA69 : rgb(251 202 105), hsl(40 95% 70%), oklch(0.863 0.128 82.7). Teintes, ombres, harmonies, contraste WCAG et APCA, et code CSS, Tailwind v4 et SCSS.
What does Orange mean? → · Sunspark color name →
#FBCA69
oklch(0.863 0.128 82.7)
Conversions de couleur
- HEX
- #fbca69
- RGB
- rgb(251 202 105)
- HSL
- hsl(40 95% 70%)
- HWB
- hwb(40 41% 2%)
- OKLCH
- oklch(0.863 0.128 82.7)
- OKLab
- oklab(0.863 0.016 0.127)
- CIE Lab
- lab(84.31 10.12 54.44)
- LCH
- lch(84.31 55.37 79.5)
- CMYK
- cmyk(0% 20% 58% 2%)
Teintes · Ombres · Tons
Teintes
- FCD07B
- FCD58B
- FDDB9B
- FDE0AA
- FEE5B8
- FEEBC7
- FEF0D5
- FFF5E3
- FFFAF1
Ombres
- DAAF5A
- BA954C
- 9C7C3E
- 7E6431
- 614D24
- 463718
- 2D220C
- 150F04
- 030200
Tons
- EEC36E
- E1BB72
- D5B475
- C8AC78
- BCA57A
- B09E7C
- A4967E
- 988F7F
- 8C8780
Harmonies de couleurs
Complémentaire +180°
- FBCA69
Sunspark
- BBD3FF
≈ Ice Cold Stare
Analogue -30° +30°
- FBCA69
Sunspark
- FFC39F
≈ Coral Gable
- D3DB74
≈ Golden Hop
Triadique +120° +240°
Complémentaire divisée +150° +210°
- FBCA69
Sunspark
- 9BDCFF
≈ Columbia Blue
- D3CAFF
≈ Innocent Snowdrop
Tétradique +90° +180° +270°
Contraste et accessibilité
Ag
FailSur blanc
WCAG 1.52:1 · APCA Lc 24
Ag
AAASur noir
WCAG 13.75:1 · APCA Lc 79
Meilleure couleur de texte: #000000
WCAG 13.75:1 (AAA) · APCA Lc 79
Contrast pairs
Extraits de code
CSS
:root {
--sunspark: #fbca69;
--sunspark-rgb: 251 202 105;
--sunspark-oklch: oklch(0.863 0.128 82.7);
}
.element {
color: var(--sunspark);
background-color: hsl(40 95% 70%);
border-color: oklch(0.863 0.128 82.7);
}Tailwind CSS v4
@theme {
--color-sunspark: #fbca69;
--color-sunspark-50: #fff3cc;
--color-sunspark-100: #fce5b8;
--color-sunspark-200: #eed195;
--color-sunspark-300: #d6b268;
--color-sunspark-400: #c39739;
--color-sunspark-500: #af7c00;
--color-sunspark-600: #946900;
--color-sunspark-700: #775400;
--color-sunspark-800: #593c00;
--color-sunspark-900: #3e2a00;
--color-sunspark-950: #271700;
}SCSS
$sunspark: #fbca69;
$sunspark-rgb: 251, 202, 105;
$sunspark-light: mix(#fff, $sunspark, 20%);
$sunspark-dark: mix(#000, $sunspark, 20%);
.element {
color: $sunspark;
box-shadow: 0 0 0 2px rgba($sunspark, 0.35);
}