Nike colors
The Nike color palette has 5 colors: Nike black #111111, White #FFFFFF, Nike Orange #FF5000, Gray 900 #1F1F21 and Gray 100 #F5F5F5. Below are HEX, RGB, HSL and OKLCH codes, contrast checks, CSS and Tailwind variables, all from its live website code checked on 16 October 2026.
Nike color codes
| Color | Role | HEX | RGB | HSL | OKLCH |
|---|---|---|---|---|---|
| Nike black | Primary | #111111 | rgb(17, 17, 17) | hsl(0, 0%, 7%) | oklch(17.8% 0 0) |
| White | Background | #FFFFFF | rgb(255, 255, 255) | hsl(0, 0%, 100%) | oklch(100% 0 0) |
| Nike Orange | Accent | #FF5000 | rgb(255, 80, 0) | hsl(19, 100%, 50%) | oklch(67.1% 0.221 37.6) |
| Gray 900 | Neutral | #1F1F21 | rgb(31, 31, 33) | hsl(240, 3%, 13%) | oklch(24% 0.004 286.1) |
| Gray 100 | Neutral | #F5F5F5 | rgb(245, 245, 245) | hsl(0, 0%, 96%) | oklch(97% 0 0) |
Select a color to open its own page with tints, shades, harmonies and every color format, or open the whole set in the palette generator.
Where the Nike colors come from
Nike does not publish hex values in public brand guidelines, so these were read from the code of its live website (stylesheets and the SVG files it serves) on 16 October 2026. They are the colors www.nike.com actually renders, which can differ slightly from print or logo colors.
- Source (live website CSS or SVG): https://www.nike.com/static/ncss/5.0/dotcom/desktop/css/ncss.en-gb.min.css checked 2026-10-16
Nike color contrast
White text on Nike black has a contrast ratio of 18.88:1 and passes WCAG AAA for any text size. Used as a text color, Nike black reaches 18.88:1 on white and 1.11:1 on black. Ratios are WCAG 2 (truncated, never rounded up); APCA Lc is shown as a second opinion.
| Pair | WCAG 2 ratio | WCAG 2 result | APCA | APCA guidance |
|---|---|---|---|---|
| White on Nike black | 18.88:1 | AAA | Lc -107.4 | Preferred for body text |
| Black on Nike black | 1.11:1 | Fails | Lc 0.0 | Not readable |
| White on Nike Orange | 3.28:1 | AA large text | Lc -64.2 | Content text, not long reading |
| Black on Nike Orange | 6.39:1 | AA | Lc 45.3 | Large or bold text, headings |
| White on Gray 900 | 16.45:1 | AAA | Lc -105.9 | Preferred for body text |
| Black on Gray 900 | 1.27:1 | Fails | Lc 0.0 | Not readable |
| White on Gray 100 | 1.09:1 | Fails | Lc 0.0 | Not readable |
| Black on Gray 100 | 19.26:1 | AAA | Lc 100.1 | Preferred for body text |
| Pair | WCAG 2 ratio | WCAG 2 result | APCA | APCA guidance |
|---|---|---|---|---|
| Nike black on Gray 100 | 17.32:1 | AAA | Lc 99.4 | Preferred for body text |
| Gray 900 on Gray 100 | 15.09:1 | AAA | Lc 97.5 | Preferred for body text |
| Nike black on Nike Orange | 5.75:1 | AA | Lc 44.6 | Non-text elements, placeholder text |
| Gray 900 on Nike Orange | 5.01:1 | AA | Lc 42.7 | Non-text elements, placeholder text |
Nike colors in CSS and Tailwind
Copy the Nike palette as CSS custom properties or as a Tailwind CSS v4 theme. The last snippet is an 11-step Tailwind scale (50 to 950) generated in OKLCH from Nike black, for hover states, borders and tinted backgrounds.
:root {
--nike-black: #111111;
--nike-white: #FFFFFF;
--nike-orange: #FF5000;
--nike-gray-900: #1F1F21;
--nike-gray-100: #F5F5F5;
}@import "tailwindcss";
@theme {
--color-nike-black: #111111;
--color-nike-white: #FFFFFF;
--color-nike-orange: #FF5000;
--color-nike-gray-900: #1F1F21;
--color-nike-gray-100: #F5F5F5;
}@theme {
--color-nike-50: #F5F5F5;
--color-nike-100: #EAEAEA;
--color-nike-200: #D9D9D9;
--color-nike-300: #C0C0C0;
--color-nike-400: #A0A0A0;
--color-nike-500: #898989;
--color-nike-600: #737373;
--color-nike-700: #616161;
--color-nike-800: #4F4F4F;
--color-nike-900: #414141;
--color-nike-950: #111111;
}Named colors closest to the Nike palette
The nearest named color to each brand color, measured as perceptual distance (ΔE OK) in OKLab. Under 0.02 is hard to tell apart; above 0.05 the difference is easy to see.
| Brand color | HEX | Nearest named color | Named HEX | ΔE OK |
|---|---|---|---|---|
| Nike black | #111111 | Almost Black | #070D0D | 0.027 |
| White | #FFFFFF | White | #FFFFFF | Exact match |
| Nike Orange | #FF5000 | Blood Orange | #FE4B03 | 0.008 |
| Gray 900 | #1F1F21 | Jet | #212529 | 0.023 |
| Gray 100 | #F5F5F5 | White Smoke | #F5F5F5 | Exact match |
Palettes like Nike
Curated palettes that include a color close to Nike black #111111.
How to use a Nike-style palette
- Lead with Nike black #111111 for buttons, links and key highlights, with white text on it.
- Give most of the layout to White #FFFFFF, Gray 900 #1F1F21 and Gray 100 #F5F5F5, about 60% of the screen, so Nike black stands out.
- Keep Nike Orange for small accents (around 10%): status colors, illustrations or charts.
- As text on a white page, Nike black reaches 18.88:1: it passes WCAG AAA for any text size.
To see how www.nike.com uses these colors today, including backgrounds, text and dark mode, run it through the website color extractor. To turn Nike black into a full light and dark color system with accessible roles, open it in the Color System Studio.
More brand colors
- Tiffany colors#81D8D0 #000000 #00A4B7
- John Deere colors#367C2B #FFDE00 #185F11 #1B1C1B
- Barbie colors#FF3EB5 #FFD8EF
- Ferrari colors#DA291C #FFF200 #000000 #FFFFFF
- Airbnb colors#FF385C #222222 #6A6A6A #92174D
- Pepsi colors#0000FE #0025FF #0E0E96 #FF1400
- YouTube colors#FF0033 #212121 #FFFFFF
- Google colors#4285F4 #EA4335 #FBBC05 #34A853
- Uber colors#000000 #FFFFFF #111111 #F6F6F6
- Apple colors#0071E3 #0066CC #1D1D1F #F5F5F7
- Lyft colors#FF00BF #1D0C17 #820076 #F1F0EC
- The Home Depot colors#F96302 #BC4B02 #333333 #FFFFFF
Trademarks
Frequently asked questions
What is the Nike hex color?
The main Nike color is Nike black #111111, which is rgb(17, 17, 17) in RGB. It comes from the CSS and SVG files of Nike's live website (Nike publishes no official hex values), checked on 16 October 2026.
What colors does Nike use?
Nike uses 5 core colors: Nike black #111111, White #FFFFFF, Nike Orange #FF5000, Gray 900 #1F1F21 and Gray 100 #F5F5F5.
What is Nike black in RGB, HSL and OKLCH?
Nike black #111111 is rgb(17, 17, 17), hsl(0, 0%, 7%) and oklch(17.8% 0 0). The closest named color is Almost Black #070D0D.
Should text on Nike black be white or black?
White text reads better on Nike black: it has a contrast ratio of 18.88:1, which passes WCAG AAA for any text size.
Where do these Nike colors come from?
The hex values were read from Nike's live website code at https://www.nike.com/static/ncss/5.0/dotcom/desktop/css/ncss.en-gb.min.css on 16 October 2026. Contrast, RGB, HSL and OKLCH values on this page are calculated from those hex codes.
Can I use the Nike colors in my own design?
Colors on their own are not owned, but Nike's name, logo and the way it combines its colors are trademarks. Use these values to match Nike when you refer to it, follow its official guidelines, and do not imply a link to Nike in your own brand.
Use the Nike colors
Check www.nike.com live, build a color system from Nike black, or remix the palette.