Tupperware color palette
ConsumerTupperware's color identity centers on a vibrant magenta, reflecting its energetic and modern brand image. The palette is clean and approachable, using bold color for impact and neutral grays for clarity.
tupperware.comTupperware colors
Click any swatch to copy its hex. Hover for RGB and HSL.
Brand colors
The colors people recognise.- Tupperware MagentaPrimary230, 0, 126
- Tupperware TealSecondary0, 178, 169
- Tupperware YellowAccent255, 209, 0
Surfaces
Page, cards and dividers.- Tupperware WhiteBackground255, 255, 255
- Tupperware Light GraySurface245, 245, 245
- Tupperware Soft GrayBorder209, 213, 219
Text
Three tiers of copy.- Tupperware CharcoalText34, 34, 34
- Tupperware Medium GraySecondary text102, 102, 102
- Tupperware Muted GrayMuted text163, 163, 163
Semantic
Feedback and state colors.- Tupperware GreenSuccess67, 176, 42
- Tupperware OrangeWarning255, 130, 0
- Tupperware RedError215, 38, 49
- Tupperware BlueInfo0, 114, 206
Use Tupperware's colors in your project
Pick a format, copy or download. Everything below is generated from the exact hex values above.
tupperware-palette-colors.css · Paste into your global stylesheet.
:root {
--info: #0072CE;
--error: #D72631;
--accent: #FFD100;
--border: #D1D5DB;
--primary: #E6007E;
--success: #43B02A;
--surface: #F5F5F5;
--warning: #FF8200;
--secondary: #00B2A9;
--text-muted: #A3A3A3;
--background: #FFFFFF;
--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
15.9:1
Pass
Text on surface
Needs 4.5:1 for body text
14.6:1
Pass
Secondary text on background
Needs 4.5:1 for body text
5.7:1
Pass
Secondary text on surface
Needs 4.5:1 for body text
5.3:1
Pass
Muted text on background
Needs 3:1 for large text
2.5:1
Fail
Muted text on surface
Needs 3:1 for large text
2.3:1
Fail
Tupperware gray and neutral colors
The quiet part of the Tupperware palette: page background, card surfaces, dividers and the three text tones that sit on them. Click a value to copy it.
- Tupperware WhiteBackground
- HEX
- RGB
- HSL
- Tupperware Light GraySurface
- HEX
- RGB
- HSL
- Tupperware Soft GrayBorder
- HEX
- RGB
- HSL
- Tupperware CharcoalText
- HEX
- RGB
- HSL
- Tupperware Medium GraySecondary text
- HEX
- RGB
- HSL
- Tupperware Muted GrayMuted text
- HEX
- RGB
- HSL
About Tupperware's colors
Tupperware's palette is anchored by a bold magenta, complemented by energetic accent colors and balanced neutrals. The system is designed for clarity, vibrancy, and accessibility.
Primary magenta contrasts with teal and yellow accents.
Neutrals provide a clean backdrop for product imagery.
Semantic colors are distinct for clear messaging.
Psychology
The magenta conveys creativity and energy, while teal and yellow add freshness and optimism. Neutral grays ensure the palette remains approachable and easy to read.
Evolution
Tupperware's palette has consistently featured magenta as its signature color since the 2010s. The supporting colors and neutrals have been refined for digital clarity and accessibility.
Where Tupperware uses each color
- Primary
Used for main brand elements, call-to-action buttons, and highlights across digital and print.
- Secondary
Appears in navigation, secondary buttons, and promotional banners.
- Accent
Used for highlights, product features, and promotional graphics.
- Backgrounds
White and light gray are used for backgrounds in web and app interfaces.
- Text
Charcoal and medium gray are used for primary and secondary text throughout the site.
- Semantic
Green, orange, red, and blue are used for status indicators, alerts, and informational messages.
Tupperware color questions
Hex codes, RGB values, neutrals and how to use the palette.
The official Tupperware brand color is magenta, hex code #E6007E.
Tupperware Magenta is RGB(230, 0, 126) and CMYK(0, 100, 13, 10). The hex code is #E6007E.
Tupperware uses several grays: #F5F5F5 (Light Gray), #D1D5DB (Soft Gray), #666666 (Medium Gray), and #A3A3A3 (Muted Gray). These are used for backgrounds, borders, and text.
Use Tupperware Magenta (#E6007E) for primary actions and branding, with teal and yellow as accents. Neutrals and semantic colors provide structure and clarity in UI and print.
The secondary color is Tupperware Teal, #00B2A9, and the accent is Tupperware Yellow, #FFD100. 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 Tupperware's colors consistently when it generates UI.
Make something in the spirit of Tupperware
Start from this palette's mood and get an original 13-color system for your own project, contrast-checked and ready to export.