Leatherman color palette
ConsumerLeatherman's color identity is centered on a bold yellow paired with deep black and neutral grays, reflecting its rugged, utilitarian brand image. The palette is consistent across digital and physical touchpoints, emphasizing clarity and durability.
leatherman.comLeatherman colors
Click any swatch to copy its hex. Hover for RGB and HSL.
Brand colors
The colors people recognise.- Leatherman YellowPrimary255, 209, 0
- Leatherman BlackSecondary35, 31, 32
- Leatherman GoldAccent255, 184, 0
Surfaces
Page, cards and dividers.- Leatherman WhiteBackground255, 255, 255
- Leatherman Light GraySurface245, 245, 245
- Leatherman Border GrayBorder209, 211, 212
Text
Three tiers of copy.- Leatherman BlackText35, 31, 32
- Leatherman Medium GraySecondary text109, 110, 113
- Leatherman Muted GrayMuted text167, 168, 170
Semantic
Feedback and state colors.- Leatherman Success GreenSuccess75, 166, 79
- Leatherman YellowWarning255, 209, 0
- Leatherman Error RedError210, 38, 48
- Leatherman Info BlueInfo0, 114, 206
Use Leatherman's colors in your project
Pick a format, copy or download. Everything below is generated from the exact hex values above.
leatherman-palette-colors.css · Paste into your global stylesheet.
:root {
--info: #0072CE;
--error: #D22630;
--accent: #FFB800;
--border: #D1D3D4;
--primary: #FFD100;
--success: #4BA64F;
--surface: #F5F5F5;
--warning: #FFD100;
--secondary: #231F20;
--text-muted: #A7A8AA;
--background: #FFFFFF;
--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
16.3:1
Pass
Text on surface
Needs 4.5:1 for body text
15.0:1
Pass
Secondary text on background
Needs 4.5:1 for body text
5.1:1
Pass
Secondary text on surface
Needs 4.5:1 for body text
4.7:1
Pass
Muted text on background
Needs 3:1 for large text
2.4:1
Fail
Muted text on surface
Needs 3:1 for large text
2.2:1
Fail
Leatherman gray and neutral colors
The quiet part of the Leatherman palette: page background, card surfaces, dividers and the three text tones that sit on them. Click a value to copy it.
- Leatherman WhiteBackground
- HEX
- RGB
- HSL
- Leatherman Light GraySurface
- HEX
- RGB
- HSL
- Leatherman Border GrayBorder
- HEX
- RGB
- HSL
- Leatherman BlackText
- HEX
- RGB
- HSL
- Leatherman Medium GraySecondary text
- HEX
- RGB
- HSL
- Leatherman Muted GrayMuted text
- HEX
- RGB
- HSL
About Leatherman's colors
Leatherman's palette uses high-contrast yellow and black for visibility and brand recognition, complemented by neutral grays for balance. The colors evoke reliability and ruggedness, suitable for a tool-focused brand.
Primary yellow contrasts with deep black for maximum legibility.
Neutral grays support UI clarity and hierarchy.
Accent gold is used to highlight key actions or features.
Psychology
Yellow conveys energy, optimism, and attention, while black signals strength and durability. The neutral grays provide a practical, no-nonsense foundation.
Evolution
Leatherman's core yellow and black palette has remained stable for decades, reinforcing brand consistency. Minor adjustments to gray tones have improved digital accessibility over time.
Where Leatherman uses each color
- Primary
Leatherman Yellow is used in the logo, primary CTAs, and key highlights on the website and packaging.
- Secondary
Leatherman Black appears in navigation bars, backgrounds, and product details.
- Accent
Leatherman Gold is used for subtle highlights and secondary buttons.
- Backgrounds
White and Light Gray backgrounds are used for content areas and product displays.
- Text
Black and Medium Gray are used for primary and secondary text, with Muted Gray for less prominent information.
- Semantic
Success Green, Warning Yellow, Error Red, and Info Blue are used for alerts, notifications, and status indicators.
Leatherman color questions
Hex codes, RGB values, neutrals and how to use the palette.
The official Leatherman brand color is Leatherman Yellow, hex code #FFD100.
Leatherman Yellow (#FFD100) in RGB is (255, 209, 0) and in CMYK is (0, 10, 100, 0).
Leatherman uses Light Gray (#F5F5F5), Border Gray (#D1D3D4), Medium Gray (#6D6E71), and Muted Gray (#A7A8AA) for UI backgrounds and text.
Use Leatherman Yellow (#FFD100) for primary actions and highlights, Black (#231F20) for text and navigation, and grays for backgrounds and secondary elements.
The secondary color is Leatherman Black, #231F20, and the accent is Leatherman Gold, #FFB800. 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 Leatherman's colors consistently when it generates UI.
Make something in the spirit of Leatherman
Start from this palette's mood and get an original 13-color system for your own project, contrast-checked and ready to export.