Cor nomeada · #F69A54
Fading Torch
Fading Torch é #F69A54: rgb(246 154 84), hsl(26 90% 65%), oklch(0.767 0.139 56). Veja tons claros, sombras, harmonias, contraste WCAG e APCA e código CSS, Tailwind v4 e SCSS.
What does Orange mean? → · Fading Torch color name →
#F69A54
oklch(0.767 0.139 56)
Conversões de cor
- HEX
- #f69a54
- RGB
- rgb(246 154 84)
- HSL
- hsl(26 90% 65%)
- HWB
- hwb(26 33% 4%)
- OKLCH
- oklch(0.767 0.139 56)
- OKLab
- oklab(0.767 0.078 0.116)
- CIE Lab
- lab(72.37 30.98 50.96)
- LCH
- lch(72.37 59.64 58.7)
- CMYK
- cmyk(0% 37% 66% 4%)
Tons claros · Sombras · Tons
Tons claros
- F8A568
- FAAF7A
- FBB98B
- FCC39C
- FDCEAD
- FED8BD
- FFE1CE
- FFEBDE
- FFF5EF
Sombras
- D68548
- B7713C
- 985E31
- 7B4B26
- 5F391B
- 452711
- 2C1708
- 150902
- 030100
Tons
- EA985B
- DE9661
- D39366
- C7916B
- BB8F70
- B08C73
- A48977
- 98867A
- 8C837D
Harmonias de cor
Complementar +180°
- F69A54
Fading Torch
- 49C0FF
≈ Megaman
Análoga -30° +30°
- F69A54
Fading Torch
- FF8F85
≈ Desert Flower
- DBAC36
≈ Yarrow
Tríade +120° +240°
- F69A54
Fading Torch
- 1DD0B0
≈ Mint Leaf
- BBA1FF
≈ Diva
Complementar dividida +150° +210°
- F69A54
Fading Torch
- 00CADC
≈ Jade Glass
- 90B1FF
≈ Kitten’s Eye
Tétrade +90° +180° +270°
- F69A54
Fading Torch
- 74CB7C
≈ Snow Pea
- 49C0FF
≈ Megaman
- E193E3
≈ Love Dust
Contraste e acessibilidade
Ag
FailSobre branco
WCAG 2.17:1 · APCA Lc 42
Ag
AAASobre preto
WCAG 9.66:1 · APCA Lc 60
Melhor cor de texto: #000000
WCAG 9.66:1 (AAA) · APCA Lc 60
Contrast pairs
Trechos de código
CSS
:root {
--fading-torch: #f69a54;
--fading-torch-rgb: 246 154 84;
--fading-torch-oklch: oklch(0.767 0.139 56);
}
.element {
color: var(--fading-torch);
background-color: hsl(26 90% 65%);
border-color: oklch(0.767 0.139 56);
}Tailwind CSS v4
@theme {
--color-fading-torch: #f69a54;
--color-fading-torch-50: #ffeccf;
--color-fading-torch-100: #ffddbb;
--color-fading-torch-200: #ffc699;
--color-fading-torch-300: #eda56d;
--color-fading-torch-400: #dc8744;
--color-fading-torch-500: #c96800;
--color-fading-torch-600: #aa5906;
--color-fading-torch-700: #894707;
--color-fading-torch-800: #663206;
--color-fading-torch-900: #482205;
--color-fading-torch-950: #2f1100;
}SCSS
$fading-torch: #f69a54;
$fading-torch-rgb: 246, 154, 84;
$fading-torch-light: mix(#fff, $fading-torch, 20%);
$fading-torch-dark: mix(#000, $fading-torch, 20%);
.element {
color: $fading-torch;
box-shadow: 0 0 0 2px rgba($fading-torch, 0.35);
}