Tangerine is a medium, vivid shade in the orange color family, with a warm feel. Its HEX code is #F28500, which equals rgb(242, 133, 0) in RGB and hsl(33, 100%, 47%) in HSL. In print terms it converts to roughly C0 M45 Y100 K5, although exact CMYK results depend on the paper and color profile.
- HEX
#F28500 - RGB
242, 133, 0 - HSL
33°, 100%, 47% - CMYK
0, 45, 100, 5 - Family
Orange - Tone
Medium, vivid
About Tangerine
Orange shades feel warm, friendly and optimistic. They sit between the intensity of red and the cheer of yellow, and work well for buttons, highlights and playful brands. Try it as a primary brand color, a section background, or a highlight against neutral layouts. Text in black is the most readable choice on this color, with a contrast ratio of 8.13:1. Its complementary color is #006CF0.
Download Tangerine as an image
Choose a size and format, then download a solid-color image — or tick colors in the library to batch-download a ZIP.
Loading colors…
Loading gradients…
Tangerine color codes
| HEX | #F28500 |
|---|---|
| RGB | rgb(242, 133, 0) |
| HSL | hsl(33, 100%, 47%) |
| HSV | 33°, 100%, 95% |
| CMYK | 0%, 45%, 100%, 5% |
| Decimal | 15893760 |
Shades and tints of Tangerine
Lighter tints are mixed with white and darker shades are mixed with black.
- 50
#FDEBD5 - 100
#FBD6AA - 200
#F9C280 - 300
#F6AE55 - 400
#F4992B - 500
#F28500 - 600
#CA6F00 - 700
#A15900 - 800
#794300 - 900
#512C00 - 950
#281600
Color harmonies for Tangerine
- Complementary
#006CF0≈ Pure Cornflower - Analogous −30°
#F00C00≈ Red - Analogous +30°
#E4F000≈ Pure Citron - Triadic +120°
#00F084≈ Pure Mint - Triadic +240°
#8400F0≈ Pure Violet - Split 150°
#00E4F0≈ Pure Lagoon - Split 210°
#0C00F0≈ Blue
Contrast and accessibility of Tangerine
| Text color | Sample | Contrast ratio | WCAG |
|---|---|---|---|
| White text on Tangerine | Aa | 2.58:1 | Fails |
| Black text on Tangerine | Aa | 8.13:1 | AAA (excellent) |
CSS code for Tangerine
background-color: #F28500;color: #F28500;background-color: rgb(242, 133, 0);background-color: hsl(33, 100%, 47%);:root { --color-tangerine: #F28500; }class="bg-[#F28500]"Colors similar to Tangerine
- Pure Orange
#FF8000 - Dark Orange
#FF8C00 - Bright Orange
#E68019 - Pure Tangerine
#FF9900 - Medium Dark Tangerine
#D68100 - Bright Tangerine
#E69419 - Pumpkin
#FF7518 - Medium Dark Amber
#D69600 - Medium Light Persimmon
#FF7E29 - Pure Persimmon
#FF6600 - Bright Persimmon
#E66B19 - Orange
#FFA500
More orange shades
- Wheat
#F5DEB3 - Amber
#FFBF00 - Champagne
#F7E7CE - Bronze
#CD7F32 - Copper
#B87333 - Marigold
#EAA221 - Pumpkin
#FF7518 - Apricot
#FBCEB1 - Peach
#FFE5B4 - Pure Cinnabar
#FF4D00 - Medium Light Cinnabar
#FF6929
Frequently asked questions
What is the HEX code for Tangerine?
The HEX code for Tangerine is #F28500.
What is the RGB value of Tangerine?
Tangerine has an RGB value of 242, 133, 0 (rgb(242, 133, 0)). In HSL it is 33°, 100%, 47%.
What text color should I use on Tangerine?
Use black text on Tangerine. White text has a contrast ratio of 2.58:1 and black text has 8.13:1; WCAG AA requires at least 4.5:1 for normal text.
What color goes well with Tangerine?
The complementary color of Tangerine is #006CF0. Analogous colors #F00C00 and #E4F000 also pair well.