itch.io color palette
Gamingitch.io uses a bold, distinctive red as its primary color, paired with a minimalistic grayscale UI for contrast and clarity. The palette emphasizes approachability and creativity within the indie gaming community.
itch.ioitch.io colors
Click any swatch to copy its hex. Hover for RGB and HSL.
Brand colors
The colors people recognise.- itch.io RedPrimary250, 92, 92
- itch.io CharcoalSecondary34, 34, 34
- itch.io Light RedAccent255, 179, 179
Surfaces
Page, cards and dividers.- itch.io WhiteBackground255, 255, 255
- itch.io Light GraySurface247, 247, 247
- itch.io Border GrayBorder229, 229, 229
Text
Three tiers of copy.- itch.io CharcoalText34, 34, 34
- itch.io Medium GraySecondary text102, 102, 102
- itch.io Muted GrayMuted text153, 153, 153
Semantic
Feedback and state colors.- itch.io Success GreenSuccess67, 181, 129
- itch.io Warning OrangeWarning255, 179, 71
- itch.io Error RedError231, 76, 60
- itch.io Info BlueInfo52, 152, 219
Use itch.io's colors in your project
Pick a format, copy or download. Everything below is generated from the exact hex values above.
itchio-palette-colors.css · Paste into your global stylesheet.
:root {
--info: #3498DB;
--error: #E74C3C;
--accent: #FFB3B3;
--border: #E5E5E5;
--primary: #FA5C5C;
--success: #43B581;
--surface: #F7F7F7;
--warning: #FFB347;
--secondary: #222222;
--text-muted: #999999;
--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.9: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.8:1
Fail
Muted text on surface
Needs 3:1 for large text
2.7:1
Fail
itch.io gray and neutral colors
The quiet part of the itch.io palette: page background, card surfaces, dividers and the three text tones that sit on them. Click a value to copy it.
- itch.io WhiteBackground
- HEX
- RGB
- HSL
- itch.io Light GraySurface
- HEX
- RGB
- HSL
- itch.io Border GrayBorder
- HEX
- RGB
- HSL
- itch.io CharcoalText
- HEX
- RGB
- HSL
- itch.io Medium GraySecondary text
- HEX
- RGB
- HSL
- itch.io Muted GrayMuted text
- HEX
- RGB
- HSL
About itch.io's colors
itch.io's palette is anchored by a vibrant red, contrasted with a clean grayscale for usability and focus. The color system is designed for high visibility and accessibility across its web platform.
Primary red is complemented by light and dark grays for structure.
Accent light red is used for highlights and hover states.
Semantic colors (green, orange, blue) are reserved for status feedback.
Psychology
The red evokes energy, excitement, and creativity, aligning with indie game culture. Grayscale elements provide a neutral backdrop, allowing content and games to stand out.
Evolution
itch.io's color palette has remained largely consistent since launch, with the red and grayscale forming its core identity. Minor adjustments have been made to accent and semantic colors for improved accessibility.
Where itch.io uses each color
- Primary
Used for main navigation bars, call-to-action buttons, and branding elements.
- Secondary
Applied to headers, footers, and UI backgrounds for contrast.
- Accent
Used for hover states, highlights, and notification badges.
- Backgrounds
White and light gray backgrounds are used throughout the site for clarity.
- Text
Charcoal and medium gray are used for primary and secondary text, ensuring readability.
- Semantic
Green, orange, and blue are used for success, warning, and informational messages respectively.
itch.io color questions
Hex codes, RGB values, neutrals and how to use the palette.
The official itch.io primary color is #FA5C5C. This red is used for branding and main UI elements.
The RGB value for #FA5C5C is (250, 92, 92). The approximate CMYK value is (0, 63, 63, 2).
itch.io uses #222222 (Charcoal), #666666 (Medium Gray), and #999999 (Muted Gray) for text and UI backgrounds. These provide a neutral, accessible interface.
Use #FA5C5C for primary actions and branding, with grays for structure and text. Semantic colors like #43B581 (Success Green) and #E74C3C (Error Red) are reserved for status indicators.
The secondary color is itch.io Charcoal, #222222, and the accent is itch.io Light Red, #FFB3B3. 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 itch.io's colors consistently when it generates UI.
Make something in the spirit of itch.io
Start from this palette's mood and get an original 13-color system for your own project, contrast-checked and ready to export.