TaylorMade color palette
SportsTaylorMade's brand color system is built around a bold, high-contrast palette featuring its signature red, black, and white. The colors reflect the brand's premium positioning in golf equipment and its focus on performance.
taylormadegolf.comTaylorMade colors
Click any swatch to copy its hex. Hover for RGB and HSL.
Brand colors
The colors people recognise.- TaylorMade RedPrimary228, 27, 19
- TaylorMade BlackSecondary35, 31, 32
- TaylorMade WhiteAccent255, 255, 255
Surfaces
Page, cards and dividers.- TaylorMade Light GrayBackground245, 245, 245
- TaylorMade Surface GraySurface237, 237, 237
- TaylorMade Border GrayBorder204, 204, 204
Text
Three tiers of copy.- TaylorMade Text BlackText35, 31, 32
- TaylorMade Text GraySecondary text109, 110, 113
- TaylorMade Muted GrayMuted text167, 168, 170
Semantic
Feedback and state colors.- TaylorMade Success GreenSuccess92, 184, 92
- TaylorMade Warning OrangeWarning240, 173, 78
- TaylorMade Error RedError217, 83, 79
- TaylorMade Info BlueInfo91, 192, 222
Use TaylorMade's colors in your project
Pick a format, copy or download. Everything below is generated from the exact hex values above.
taylormade-palette-colors.css · Paste into your global stylesheet.
:root {
--info: #5BC0DE;
--error: #D9534F;
--accent: #FFFFFF;
--border: #CCCCCC;
--primary: #E41B13;
--success: #5CB85C;
--surface: #EDEDED;
--warning: #F0AD4E;
--secondary: #231F20;
--text-muted: #A7A8AA;
--background: #F5F5F5;
--text-primary: #231F20;
--text-secondary: #6D6E71;
}Contrast and accessibility
Every text tone tested against every surface, per WCAG 2.1.
Text on background
Needs 4.5:1 for body text
15.0:1
Pass
Text on surface
Needs 4.5:1 for body text
13.9:1
Pass
Secondary text on background
Needs 4.5:1 for body text
4.7:1
Pass
Secondary text on surface
Needs 4.5:1 for body text
4.4:1
Fail
Muted text on background
Needs 3:1 for large text
2.2:1
Fail
Muted text on surface
Needs 3:1 for large text
2.0:1
Fail
TaylorMade gray and neutral colors
The quiet part of the TaylorMade palette: page background, card surfaces, dividers and the three text tones that sit on them. Click a value to copy it.
- TaylorMade Light GrayBackground
- HEX
- RGB
- HSL
- TaylorMade Surface GraySurface
- HEX
- RGB
- HSL
- TaylorMade Border GrayBorder
- HEX
- RGB
- HSL
- TaylorMade Text BlackText
- HEX
- RGB
- HSL
- TaylorMade Text GraySecondary text
- HEX
- RGB
- HSL
- TaylorMade Muted GrayMuted text
- HEX
- RGB
- HSL
About TaylorMade's colors
TaylorMade's palette uses high-contrast red, black, and white to convey power and clarity. The supporting grays provide balance and a modern, technical feel.
Red and black create a bold, energetic contrast.
White and light grays are used for clarity and space.
Accent colors are reserved for functional UI feedback.
Psychology
Red signals energy, action, and confidence, aligning with TaylorMade's performance-driven image. Black and gray reinforce reliability and sophistication.
Evolution
TaylorMade's core red, black, and white palette has remained consistent for decades, reinforcing strong brand recognition. Minor adjustments to gray tones have modernized the UI in recent years.
Where TaylorMade uses each color
- Primary
TaylorMade Red is used for key brand marks, call-to-action buttons, and highlights on packaging.
- Secondary
TaylorMade Black appears in the logo, navigation bars, and product text.
- Accent
TaylorMade White is used for backgrounds, logo contrast, and product photography.
- Backgrounds
Light and surface grays provide neutral backgrounds for web and print layouts.
- Text
Text Black and Text Gray are used for primary and secondary text across digital and print materials.
- Semantic
Success, warning, error, and info colors are used for UI states and notifications in digital applications.
TaylorMade color questions
Hex codes, RGB values, neutrals and how to use the palette.
The official TaylorMade primary brand color is red, with the hex code #E41B13.
TaylorMade Red (#E41B13) is RGB(228, 27, 19) and CMYK(0, 88, 92, 11).
TaylorMade uses several grays: Light Gray (#F5F5F5), Surface Gray (#EDEDED), Border Gray (#CCCCCC), Text Gray (#6D6E71), and Muted Gray (#A7A8AA) for UI and backgrounds.
Use TaylorMade Red (#E41B13) for primary actions and branding, Black (#231F20) for text and navigation, and the grays for backgrounds and borders. Accent and semantic colors are reserved for UI feedback and notifications.
The secondary color is TaylorMade Black, #231F20, and the accent is TaylorMade White, #FFFFFF. Together with the primary they make up the three brand colors at the top of this page.
3 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 TaylorMade's colors consistently when it generates UI.
Make something in the spirit of TaylorMade
Start from this palette's mood and get an original 13-color system for your own project, contrast-checked and ready to export.