Video Games
Supercell Color Codes
Supercell works in near-black, hex #100F0D, on white. The Supercell color codes in Hex, RGB and CMYK can be found below. Ilkka Paananen and five others founded it in Helsinki in 2010, organized into small independent teams that kill their own projects if they do not hit a bar; Clash of Clans, Clash Royale and Brawl Stars came through that filter. Its nearest peer on this site is miHoYo.
Primary colors
What are Supercell Primary Colors?
Supercell's primary colors are black #100F0D, white #FFFFFF.
Supercell runs a near-black wordmark; the values shown are near-black and white.
Supercell Black
| Hex | #100F0D |
|---|---|
| RGB | 16, 15, 13 |
| HSL | hsl(40, 10%, 6%) |
| CMYK | 0%, 6%, 19%, 94%converted · approximate |
| Pantone | PMS 419 Cnearest match · not published by the brand |
Supercell White
| Hex | #FFFFFF |
|---|---|
| RGB | 255, 255, 255 |
| HSL | hsl(0, 0%, 100%) |
| CMYK | 0%, 0%, 0%, 0%converted · approximate |
| Pantone | PMS 656 Cnearest match · not published by the brand |
Supercell Hex Color Codes
Supercell hex color codes are #100F0D for black and #FFFFFF for white.
| Color | Hex |
|---|---|
| Black | #100F0D |
| White | #FFFFFF |
Supercell RGB Color Codes
Supercell RGB color codes are 16, 15, 13 for black and 255, 255, 255 for white. Reach for RGB when a tool wants channel numbers or a CSS alpha value.
| Color | RGB |
|---|---|
| Black | rgb(16, 15, 13) |
| White | rgb(255, 255, 255) |
Supercell HSL Color Codes
Supercell HSL color codes are 40, 10%, 6% for black and 0, 0%, 100% for white. Change the third value for a lighter or darker version without moving the hue.
| Color | HSL |
|---|---|
| Black | hsl(40, 10%, 6%) |
| White | hsl(0, 0%, 100%) |
Supercell CMYK Color Code
Supercell CMYK color codes are conversions from the hex, because the brand publishes none. Check a printed proof before a full run.
| Color | CMYK |
|---|---|
| Black | 0%, 6%, 19%, 94% |
| White | 0%, 0%, 0%, 0% |
Supercell Pantone Color Codes
Supercell Pantone color codes are nearest matches by color distance, not brand specs. The table shows the closest swatch for every color.
| Color | Nearest Pantone |
|---|---|
| Black | PMS 419 C |
| White | PMS 656 C |
Logo
Supercell Logo Colors
Supercell logo colors are near-black on white, a plain lowercase wordmark.
Supercell Logo Colors Palette
What the Supercell Logo Colors Mean?
The Supercell mark is deliberately quiet, a plain lowercase wordmark in near-black, because the studio's identity is its games and each of those has its own loud, cartoon palette. A neutral parent logo lets Clash, Hay Day and Brawl Stars look nothing alike while still sitting under one company.
Supercell Logo Color History
Supercell logo color history is short and stable. The lowercase wordmark has run in black or white since the company was small, with no symbol added.
Supercell Logo Fonts
Supercell logo fonts are a custom bold sans, rounded and even. A geometric rounded sans like Gotham Rounded is the closest match.
Supercell Logo JPG
Supercell logo in JPG. No transparency, so it is flattened onto white. Safe for documents and slide decks.
Supercell Logo PNG
Supercell logo in PNG, with a transparent background. Use it over a colored surface.
Supercell Logo WebP
Supercell logo in WebP. Same transparency as the PNG at about a third of the file size.
Supercell Color Code Shades
Supercell color code shades step evenly from the primary toward black, for hover states, borders and shadows.
These are interface steps, not Supercell paint or trim names.
In code
Using the Supercell palette
CSS custom properties
:root {
--supercell-black: #100F0D;
--supercell-white: #FFFFFF;
}Contrast against white
| Black | 19.16:1AA ✓ |
|---|---|
| White | 1.00:1AA × |
Brand colors are chosen for recognition, not for legibility. A failing value here is normal. It means use it as a fill, not as text.