Cor nomeada · #FFC355
Orange Delight
Orange Delight é #FFC355: rgb(255 195 85), hsl(39 100% 67%), oklch(0.852 0.142 79.8). Veja tons claros, sombras, harmonias, contraste WCAG e APCA e código CSS, Tailwind v4 e SCSS.
What does Orange mean? → · Orange Delight color name →
#FFC355
oklch(0.852 0.142 79.8)
Conversões de cor
- HEX
- #ffc355
- RGB
- rgb(255 195 85)
- HSL
- hsl(39 100% 67%)
- HWB
- hwb(39 33% 0%)
- OKLCH
- oklch(0.852 0.142 79.8)
- OKLab
- oklab(0.852 0.025 0.14)
- CIE Lab
- lab(82.87 14.3 61.96)
- LCH
- lch(82.87 63.59 77)
- CMYK
- cmyk(0% 24% 67% 0%)
Tons claros · Sombras · Tons
Tons claros
- FFC96B
- FFD07E
- FFD690
- FFDCA1
- FFE2B1
- FFE8C1
- FFEED1
- FFF4E0
- FFF9F0
Sombras
- DEA949
- BE903D
- 9E7831
- 806026
- 634A1C
- 483411
- 2E2008
- 160E02
- 030200
Tons
- F2BC5D
- E5B664
- D8AF6A
- CBA96F
- BEA273
- B29B77
- A5947A
- 998E7C
- 8C877E
Harmonias de cor
Complementar +180°
- FFC355
Orange Delight
- B3D0FF
≈ Ice Cold Stare
Análoga -30° +30°
- FFC355
Orange Delight
- FFBE9A
≈ Happy Prawn
- D4D65E
≈ Matcha
Tríade +120° +240°
- FFC355
Orange Delight
- 1BEAF2
≈ Phosphorescent Blue
- F1B5FF
≈ Strawberry Buttercream
Complementar dividida +150° +210°
- FFC355
Orange Delight
- 8DDAFF
≈ Tranquil Pool
- CDC6FF
≈ Innocent Snowdrop
Tétrade +90° +180° +270°
- FFC355
Orange Delight
- 56ECC0
≈ Aphrodite Aqua
- B3D0FF
≈ Ice Cold Stare
- FFB5D7
≈ Lavender Candy
Contraste e acessibilidade
Ag
FailSobre branco
WCAG 1.59:1 · APCA Lc 27
Ag
AAASobre preto
WCAG 13.18:1 · APCA Lc 76
Melhor cor de texto: #000000
WCAG 13.18:1 (AAA) · APCA Lc 76
Contrast pairs
Trechos de código
CSS
:root {
--orange-delight: #ffc355;
--orange-delight-rgb: 255 195 85;
--orange-delight-oklch: oklch(0.852 0.142 79.8);
}
.element {
color: var(--orange-delight);
background-color: hsl(39 100% 67%);
border-color: oklch(0.852 0.142 79.8);
}Tailwind CSS v4
@theme {
--color-orange-delight: #ffc355;
--color-orange-delight-50: #fff2c8;
--color-orange-delight-100: #ffe4b2;
--color-orange-delight-200: #f3cf8d;
--color-orange-delight-300: #dcb05d;
--color-orange-delight-400: #ca9323;
--color-orange-delight-500: #b67800;
--color-orange-delight-600: #9a6600;
--color-orange-delight-700: #7c5100;
--color-orange-delight-800: #5d3a00;
--color-orange-delight-900: #412800;
--color-orange-delight-950: #2a1600;
}SCSS
$orange-delight: #ffc355;
$orange-delight-rgb: 255, 195, 85;
$orange-delight-light: mix(#fff, $orange-delight, 20%);
$orange-delight-dark: mix(#000, $orange-delight, 20%);
.element {
color: $orange-delight;
box-shadow: 0 0 0 2px rgba($orange-delight, 0.35);
}