Gumroad color palette
EcommerceGumroad's color identity features a distinctive pastel pink primary, complemented by soft neutrals and expressive accent colors. The palette is playful yet minimal, reflecting the brand's creative and approachable ecommerce platform.
gumroad.comGumroad colors
Click any swatch to copy its hex. Hover for RGB and HSL.
Brand colors
The colors people recognise.- Gumroad PinkPrimary255, 144, 232
- Gumroad BlueSecondary110, 231, 255
- Gumroad PeachAccent255, 184, 107
Surfaces
Page, cards and dividers.- Gumroad WhiteBackground255, 255, 255
- Gumroad Light GraySurface247, 248, 250
- Gumroad Border GrayBorder226, 232, 240
Text
Three tiers of copy.- Gumroad CharcoalText34, 34, 34
- Gumroad Medium GraySecondary text102, 102, 102
- Gumroad Muted GrayMuted text160, 174, 192
Semantic
Feedback and state colors.- Gumroad GreenSuccess74, 222, 128
- Gumroad YellowWarning255, 214, 0
- Gumroad RedError255, 90, 95
- Gumroad Info BlueInfo58, 191, 248
Use Gumroad's colors in your project
Pick a format, copy or download. Everything below is generated from the exact hex values above.
gumroad-palette-colors.css · Paste into your global stylesheet.
:root {
--info: #3ABFF8;
--error: #FF5A5F;
--accent: #FFB86B;
--border: #E2E8F0;
--primary: #FF90E8;
--success: #4ADE80;
--surface: #F7F8FA;
--warning: #FFD600;
--secondary: #6EE7FF;
--text-muted: #A0AEC0;
--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
15.0: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.4:1
Pass
Muted text on background
Needs 3:1 for large text
2.3:1
Fail
Muted text on surface
Needs 3:1 for large text
2.1:1
Fail
Gumroad background, border and text colors
The quiet part of the Gumroad palette: page background, card surfaces, dividers and the three text tones that sit on them. Click a value to copy it.
- Gumroad WhiteBackground
- HEX
- RGB
- HSL
- Gumroad Light GraySurface
- HEX
- RGB
- HSL
- Gumroad Border GrayBorder
- HEX
- RGB
- HSL
- Gumroad CharcoalText
- HEX
- RGB
- HSL
- Gumroad Medium GraySecondary text
- HEX
- RGB
- HSL
- Gumroad Muted GrayMuted text
- HEX
- RGB
- HSL
About Gumroad's colors
Gumroad's palette is built around a soft, inviting pink, balanced by light neutrals and gentle accent hues. The colors are chosen to evoke creativity and approachability while maintaining clarity and readability.
Primary pink is complemented by blue and peach for visual interest.
Neutrals provide a clean, minimal backdrop for content.
Accent colors are used sparingly to highlight actions and statuses.
Psychology
The pastel pink primary conveys friendliness and creativity, while the supporting colors maintain a sense of calm and clarity. The overall effect is welcoming and non-intimidating for creators and customers.
Evolution
Gumroad's palette has remained largely consistent, with the pink primary as a recognizable anchor. Minor adjustments to neutral tones have improved accessibility and UI clarity over time.
Where Gumroad uses each color
- Primary
Used for main action buttons, highlights, and the logo.
- Secondary
Appears in secondary buttons, links, and some UI accents.
- Accent
Used for notification badges and subtle highlights.
- Backgrounds
White and light gray backgrounds are used throughout dashboards and product pages.
- Text
Charcoal and gray tones are used for headings, body text, and muted labels.
- Semantic
Green, yellow, and red are used for success, warning, and error states in forms and notifications.
Gumroad color questions
Hex codes, RGB values, neutrals and how to use the palette.
The official Gumroad primary color is #FF90E8. This pastel pink is used for main branding and key UI elements.
Gumroad Pink (#FF90E8) is RGB(255, 144, 232). For CMYK, it is approximately (0, 44, 9, 0).
Gumroad uses #F7F8FA (Light Gray), #E2E8F0 (Border Gray), #222222 (Charcoal), #666666 (Medium Gray), and #A0AEC0 (Muted Gray) for backgrounds, borders, and text. These neutrals ensure readability and a clean interface.
Use #FF90E8 for primary actions and branding, with secondary and accent colors for supporting UI elements. Neutrals provide structure and clarity, while semantic colors indicate status or feedback.
The secondary color is Gumroad Blue, #6EE7FF, and the accent is Gumroad Peach, #FFB86B. 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 Gumroad's colors consistently when it generates UI.
Make something in the spirit of Gumroad
Start from this palette's mood and get an original 13-color system for your own project, contrast-checked and ready to export.