Couleur nommée la plus proche · #ED7B32
#ED7B32
Couleur nommée la plus proche: Spiced up Orange
#ED7B32 (rgb(237 123 50), hsl(23 84% 56%), oklch(0.701 0.163 49.4)) est la plus proche de la couleur nommée Spiced up Orange. Teintes, ombres, harmonies, contraste WCAG et APCA, et code CSS, Tailwind v4 et SCSS.
#ED7B32
oklch(0.701 0.163 49.4)
Conversions de couleur
- HEX
- #ed7b32
- RGB
- rgb(237 123 50)
- HSL
- hsl(23 84% 56%)
- HWB
- hwb(23 20% 7%)
- OKLCH
- oklch(0.701 0.163 49.4)
- OKLab
- oklab(0.701 0.106 0.124)
- CIE Lab
- lab(64.35 41.53 58.04)
- LCH
- lch(64.35 71.37 54.4)
- CMYK
- cmyk(0% 48% 79% 7%)
Teintes · Ombres · Tons
Teintes
- F0894C
- F49763
- F6A577
- F9B28B
- FBBF9F
- FCCCB2
- FED9C5
- FFE6D9
- FFF2EC
Ombres
- CE6A2A
- B05A22
- 934A1B
- 773A14
- 5C2C0D
- 421E07
- 2A1003
- 140501
- 030100
Tons
- E37D3F
- D87E4A
- CE7F53
- C3805B
- B88162
- AD8169
- A2816F
- 978175
- 8C817B
Harmonies de couleurs
Complémentaire +180°
- ED7B32
Spiced up Orange
- 00AEE3
≈ Royal Peacock
Analogue -30° +30°
- ED7B32
Spiced up Orange
- F36F75
≈ Sugar Coral
- CE9200
≈ Elysium Gold
Triadique +120° +240°
- ED7B32
Spiced up Orange
- 00BA90
≈ Mountain Meadow
- 9E8AFC
≈ Lavender Blue Shadow
Complémentaire divisée +150° +210°
- ED7B32
Spiced up Orange
- 00B5BB
≈ Cyan Sky
- 619EFF
≈ Blue Chaos
Tétradique +90° +180° +270°
- ED7B32
Spiced up Orange
- 64B64D
≈ Pure Apple
- 00AEE3
≈ Royal Peacock
- CA7ADE
≈ Lavender Perceptions
Contraste et accessibilité
Ag
FailSur blanc
WCAG 2.80:1 · APCA Lc 53
Ag
AAASur noir
WCAG 7.48:1 · APCA Lc 48
Meilleure couleur de texte: #000000
WCAG 7.48:1 (AAA) · APCA Lc 48
Contrast pairs
Extraits de code
CSS
:root {
--spiced-up-orange: #ed7b32;
--spiced-up-orange-rgb: 237 123 50;
--spiced-up-orange-oklch: oklch(0.701 0.163 49.4);
}
.element {
color: var(--spiced-up-orange);
background-color: hsl(23 84% 56%);
border-color: oklch(0.701 0.163 49.4);
}Tailwind CSS v4
@theme {
--color-spiced-up-orange: #ed7b32;
--color-spiced-up-orange-50: #ffe9cb;
--color-spiced-up-orange-100: #ffd9b7;
--color-spiced-up-orange-200: #ffc094;
--color-spiced-up-orange-300: #f99e66;
--color-spiced-up-orange-400: #e97d3a;
--color-spiced-up-orange-500: #d75c00;
--color-spiced-up-orange-600: #b64e00;
--color-spiced-up-orange-700: #923f00;
--color-spiced-up-orange-800: #6d2c00;
--color-spiced-up-orange-900: #4d1e01;
--color-spiced-up-orange-950: #330d00;
}SCSS
$spiced-up-orange: #ed7b32;
$spiced-up-orange-rgb: 237, 123, 50;
$spiced-up-orange-light: mix(#fff, $spiced-up-orange, 20%);
$spiced-up-orange-dark: mix(#000, $spiced-up-orange, 20%);
.element {
color: $spiced-up-orange;
box-shadow: 0 0 0 2px rgba($spiced-up-orange, 0.35);
}