Color con nombre más cercano · #ED7C1D
#ED7C1D
Color con nombre más cercano: Retro Nectarine
#ED7C1D (rgb(237 124 29), hsl(27 85% 52%), oklch(0.702 0.168 53.4)) se parece más al color con nombre Retro Nectarine. Mira tintes, sombras, armonías, contraste WCAG y APCA, y código CSS, Tailwind v4 y SCSS.
#ED7C1D
oklch(0.702 0.168 53.4)
Conversiones de color
- HEX
- #ed7c1d
- RGB
- rgb(237 124 29)
- HSL
- hsl(27 85% 52%)
- HWB
- hwb(27 11% 7%)
- OKLCH
- oklch(0.702 0.168 53.4)
- OKLab
- oklab(0.702 0.1 0.135)
- CIE Lab
- lab(64.46 40.65 65.71)
- LCH
- lch(64.46 77.27 58.3)
- CMYK
- cmyk(0% 48% 88% 7%)
Tintes · Sombras · Tonos
Tintes
- F08A41
- F3985A
- F6A571
- F9B386
- FBC09B
- FCCCAF
- FED9C3
- FEE6D7
- FFF2EB
Sombras
- CE6B18
- B05A13
- 934A0E
- 773B09
- 5C2C05
- 421E03
- 2A1101
- 140500
- 030100
Tonos
- E37E32
- D87F40
- CE804C
- C38155
- B8815E
- AD8166
- A2816D
- 978174
- 8C817A
Armonías de color
Complementario +180°
- ED7C1D
Retro Nectarine
- 00ACEA
≈ Vivid Cerulean
Análogo -30° +30°
- ED7C1D
Retro Nectarine
- F66E6B
≈ Breeze of Chilli
- CA9500
≈ Retro Vibe
Triádico +120° +240°
- ED7C1D
Retro Nectarine
- 00B998
≈ Aoife’s Green
- A587FD
≈ Lilac Geode
Complementario dividido +150° +210°
- ED7C1D
Retro Nectarine
- 00B4C0
≈ Marrakech Mile
- 6B9BFF
≈ Blue Chaos
Tetrádico +90° +180° +270°
- ED7C1D
Retro Nectarine
- 55B954
≈ Forest Maid
- 00ACEA
≈ Vivid Cerulean
- D077DA
≈ Jewel Caterpillar
Contraste y accesibilidad
Ag
FailSobre blanco
WCAG 2.79:1 · APCA Lc 53
Ag
AAASobre negro
WCAG 7.50:1 · APCA Lc 49
Mejor color de texto: #000000
WCAG 7.50:1 (AAA) · APCA Lc 49
Contrast pairs
Fragmentos de código
CSS
:root {
--retro-nectarine: #ed7c1d;
--retro-nectarine-rgb: 237 124 29;
--retro-nectarine-oklch: oklch(0.702 0.168 53.4);
}
.element {
color: var(--retro-nectarine);
background-color: hsl(27 85% 52%);
border-color: oklch(0.702 0.168 53.4);
}Tailwind CSS v4
@theme {
--color-retro-nectarine: #ed7c1d;
--color-retro-nectarine-50: #ffe9c8;
--color-retro-nectarine-100: #ffdab2;
--color-retro-nectarine-200: #ffc18d;
--color-retro-nectarine-300: #f99f5d;
--color-retro-nectarine-400: #e97e2a;
--color-retro-nectarine-500: #d75c00;
--color-retro-nectarine-600: #b64f00;
--color-retro-nectarine-700: #923f00;
--color-retro-nectarine-800: #6d2c00;
--color-retro-nectarine-900: #4d1e00;
--color-retro-nectarine-950: #330d00;
}SCSS
$retro-nectarine: #ed7c1d;
$retro-nectarine-rgb: 237, 124, 29;
$retro-nectarine-light: mix(#fff, $retro-nectarine, 20%);
$retro-nectarine-dark: mix(#000, $retro-nectarine, 20%);
.element {
color: $retro-nectarine;
box-shadow: 0 0 0 2px rgba($retro-nectarine, 0.35);
}