Kawasaki color palette
AutomotiveKawasaki's brand identity is defined by its iconic green, paired with bold black and white neutrals for a high-contrast, energetic look. The color system is instantly recognizable in motorsports and automotive contexts.
kawasaki.comKawasaki colors
Click any swatch to copy its hex. Hover for RGB and HSL.
Brand colors
The colors people recognise.- Kawasaki GreenPrimary0, 166, 81
- Kawasaki BlackSecondary0, 0, 0
- Kawasaki WhiteAccent255, 255, 255
Surfaces
Page, cards and dividers.- Kawasaki Light GrayBackground245, 245, 245
- Kawasaki Surface GraySurface230, 230, 230
- Kawasaki Border GrayBorder204, 204, 204
Text
Three tiers of copy.- Kawasaki Text BlackText34, 34, 34
- Kawasaki Text GraySecondary text102, 102, 102
- Kawasaki Muted GrayMuted text153, 153, 153
Semantic
Feedback and state colors.- Kawasaki GreenSuccess0, 166, 81
- Kawasaki YellowWarning255, 194, 14
- Kawasaki RedError213, 43, 30
- Kawasaki BlueInfo0, 114, 206
Use Kawasaki's colors in your project
Pick a format, copy or download. Everything below is generated from the exact hex values above.
kawasaki-palette-colors.css · Paste into your global stylesheet.
:root {
--info: #0072CE;
--error: #D52B1E;
--accent: #FFFFFF;
--border: #CCCCCC;
--primary: #00A651;
--success: #00A651;
--surface: #E6E6E6;
--warning: #FFC20E;
--secondary: #000000;
--text-muted: #999999;
--background: #F5F5F5;
--text-primary: #222222;
--text-secondary: #666666;
}Contrast and accessibility
Every text tone tested against every surface, per WCAG 2.1.
Text on background
Needs 4.5:1 for body text
14.6:1
Pass
Text on surface
Needs 4.5:1 for body text
12.7:1
Pass
Secondary text on background
Needs 4.5:1 for body text
5.3:1
Pass
Secondary text on surface
Needs 4.5:1 for body text
4.6:1
Pass
Muted text on background
Needs 3:1 for large text
2.6:1
Fail
Muted text on surface
Needs 3:1 for large text
2.3:1
Fail
Kawasaki gray and neutral colors
The quiet part of the Kawasaki palette: page background, card surfaces, dividers and the three text tones that sit on them. Click a value to copy it.
- Kawasaki Light GrayBackground
- HEX
- RGB
- HSL
- Kawasaki Surface GraySurface
- HEX
- RGB
- HSL
- Kawasaki Border GrayBorder
- HEX
- RGB
- HSL
- Kawasaki Text BlackText
- HEX
- RGB
- HSL
- Kawasaki Text GraySecondary text
- HEX
- RGB
- HSL
- Kawasaki Muted GrayMuted text
- HEX
- RGB
- HSL
About Kawasaki's colors
Kawasaki's palette is built around a vivid green, contrasted with black, white, and neutral grays for clarity and impact. The green is used as a signature identifier across all brand touchpoints.
Primary green contrasts with black and white for high visibility.
Grays provide neutral backgrounds and UI surfaces.
Accent colors are used sparingly to highlight key actions or information.
Psychology
Kawasaki Green conveys energy, innovation, and a sense of speed, reflecting the brand's motorsports heritage. The black and white elements reinforce professionalism and technical precision.
Evolution
The core green has remained consistent since the 1960s, becoming synonymous with Kawasaki's racing identity. The supporting palette of black, white, and grays has been refined for modern digital and print applications.
Where Kawasaki uses each color
- Primary
Kawasaki Green is used on motorcycles, racing liveries, and as the main highlight on digital interfaces.
- Secondary
Kawasaki Black is featured in logos, navigation bars, and product details.
- Accent
Kawasaki White is used for text, icons, and to provide contrast in layouts.
- Backgrounds
Kawasaki Light Gray and Surface Gray are used for website backgrounds and UI panels.
- Text
Text Black and Text Gray are used for primary and secondary content across all digital and print materials.
- Semantic
Yellow, Red, and Blue are used for status indicators, alerts, and informational highlights.
Kawasaki color questions
Hex codes, RGB values, neutrals and how to use the palette.
The official Kawasaki brand color is Kawasaki Green, hex code #00A651. This color is used as the primary identifier for the brand.
Kawasaki Green is RGB(0, 166, 81) and typically CMYK(100, 0, 85, 35). The hex code is #00A651.
Kawasaki uses Light Gray (#F5F5F5), Surface Gray (#E6E6E6), Border Gray (#CCCCCC), and various text grays (#222222, #666666, #999999) for UI and backgrounds.
Use Kawasaki Green (#00A651) for primary highlights, black and white for contrast, and grays for backgrounds and surfaces. Accent and semantic colors should support, not overpower, the primary palette.
The secondary color is Kawasaki Black, #000000, and the accent is Kawasaki White, #FFFFFF. Together with the primary they make up the three brand colors at the top of this page.
4 of 6 text and background pairings meet WCAG 2.1 AA contrast. The contrast section above shows every pairing with its exact ratio.
Use the export block on this page. It gives you CSS custom properties, a Tailwind config, W3C design tokens or a shadcn/ui theme built from these exact hex values, with copy and download buttons.
Yes. Export the Claude Code skill, Cursor rules or Codex prompt from the same block. The agent then applies Kawasaki's colors consistently when it generates UI.
Make something in the spirit of Kawasaki
Start from this palette's mood and get an original 13-color system for your own project, contrast-checked and ready to export.