Vitamix color palette
ConsumerVitamix uses a bold, energetic red as its primary brand color, complemented by a clean, neutral palette of grays and black for clarity and professionalism. The color system is designed for strong brand recognition and product visibility.
vitamix.comVitamix colors
Click any swatch to copy its hex. Hover for RGB and HSL.
Brand colors
The colors people recognise.- Vitamix RedPrimary227, 24, 55
- Vitamix BlackSecondary35, 31, 32
- Vitamix SilverAccent167, 168, 170
Surfaces
Page, cards and dividers.- Vitamix WhiteBackground255, 255, 255
- Vitamix Light GraySurface245, 245, 245
- Vitamix Border GrayBorder209, 211, 212
Text
Three tiers of copy.- Vitamix Text BlackText35, 31, 32
- Vitamix GraySecondary text109, 110, 113
- Vitamix Muted GrayMuted text167, 168, 170
Semantic
Feedback and state colors.- Vitamix GreenSuccess67, 176, 42
- Vitamix YellowWarning246, 190, 0
- Vitamix Error RedError227, 24, 55
- Vitamix BlueInfo0, 114, 206
Use Vitamix's colors in your project
Pick a format, copy or download. Everything below is generated from the exact hex values above.
vitamix-palette-colors.css · Paste into your global stylesheet.
:root {
--info: #0072CE;
--error: #E31837;
--accent: #A7A8AA;
--border: #D1D3D4;
--primary: #E31837;
--success: #43B02A;
--surface: #F5F5F5;
--warning: #F6BE00;
--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
Vitamix gray and neutral colors
The quiet part of the Vitamix palette: page background, card surfaces, dividers and the three text tones that sit on them. Click a value to copy it.
- Vitamix WhiteBackground
- HEX
- RGB
- HSL
- Vitamix Light GraySurface
- HEX
- RGB
- HSL
- Vitamix Border GrayBorder
- HEX
- RGB
- HSL
- Vitamix Text BlackText
- HEX
- RGB
- HSL
- Vitamix GraySecondary text
- HEX
- RGB
- HSL
- Vitamix Muted GrayMuted text
- HEX
- RGB
- HSL
About Vitamix's colors
Vitamix's color palette is anchored by a vivid red, symbolizing energy and vitality, with supporting neutrals for balance and legibility. The palette is functional, ensuring product and brand clarity across all touchpoints.
Primary red is paired with black and white for high contrast.
Accent silver and muted grays provide depth and hierarchy.
Semantic colors (green, yellow, blue) are reserved for UI feedback and status.
Psychology
Red conveys excitement, passion, and power, aligning with Vitamix's focus on healthy, energetic lifestyles. The use of black and gray adds professionalism and trust.
Evolution
Vitamix's core red has remained consistent for decades, reinforcing strong brand recognition. The supporting palette has evolved slightly to modernize the UI and improve accessibility.
Where Vitamix uses each color
- Primary
Vitamix Red is used in the logo, primary buttons, and key calls to action.
- Secondary
Vitamix Black appears in navigation bars, product names, and footer backgrounds.
- Accent
Vitamix Silver is used for UI highlights, icons, and product details.
- Backgrounds
Vitamix White and Light Gray are used for page backgrounds and content areas.
- Text
Text Black is for primary headings and body text, while Gray and Muted Gray are for secondary and disabled text.
- Semantic
Green, Yellow, and Blue are used for success, warning, and informational UI states respectively.
Vitamix color questions
Hex codes, RGB values, neutrals and how to use the palette.
The official Vitamix brand color is Vitamix Red, with the hex code #E31837.
Vitamix Red (#E31837) is RGB(227, 24, 55) and CMYK(0, 89, 76, 11).
Vitamix uses Vitamix Black (#231F20), Vitamix Gray (#6D6E71), and Vitamix Silver (#A7A8AA) as its primary neutral tones.
Use Vitamix Red for primary actions and branding, with neutrals for backgrounds and text. Semantic colors are reserved for status indicators and UI feedback.
The secondary color is Vitamix Black, #231F20, and the accent is Vitamix Silver, #A7A8AA. 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 Vitamix's colors consistently when it generates UI.
Make something in the spirit of Vitamix
Start from this palette's mood and get an original 13-color system for your own project, contrast-checked and ready to export.