Hack Club Brand
Download HQ’s logos and preview our brand colors & font.
Hack Club must always be written as Hack Club, not hackclub / Hackclub / HackClub / hackClub
Same with Hack Clubber or Hack Clubbers. It's never hackclubbers or Hackclubbers
Important / should not be missable by anyone who is designing a sticker: All sticker designs must have the text Hack Club somewhere on the design. It can be subtle, but "Hack Club" must appear somewhere on the design
Logos
Download all →
HCB Logos
See all HCB logos →
HTML banners
| Preview | HTML code |
|---|---|
 | <a href="https://hackclub.com/"><img style="position: absolute; top: 0; left: 10px; border: 0; width: 256px; z-index: 999;" src="https://assets.hackclub.com/flag-orpheus-top.svg" alt="Hack Club"/></a> |
 | <a href="https://hackclub.com/"><img style="position: absolute; top: 0; left: 10px; border: 0; width: 256px; z-index: 999;" src="https://assets.hackclub.com/flag-orpheus-left.svg" alt="Hack Club"/></a> |
 | <a href="https://hackclub.com/"><img style="position: absolute; top: 0; left: 10px; border: 0; width: 256px; z-index: 999;" src="https://assets.hackclub.com/banners/2025.svg" alt="Hack Club"/></a> |
Colors
red#ec3750
orange#ff8c37
yellow#f1c40f
green#33d6a6
cyan#5bc0de
blue#338eda
purple#a633d6
muted#8492a6
Fonts
Phantom Sansis our brand font.Webfont CSS (for HQ sites only)
@font-face {
font-family: 'Phantom Sans';
src: url('https://assets.hackclub.com/fonts/Phantom_Sans_0.7/Regular.woff')
format('woff'),
url('https://assets.hackclub.com/fonts/Phantom_Sans_0.7/Regular.woff2')
format('woff2');
font-weight: normal;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: 'Phantom Sans';
src: url('https://assets.hackclub.com/fonts/Phantom_Sans_0.7/Italic.woff')
format('woff'),
url('https://assets.hackclub.com/fonts/Phantom_Sans_0.7/Italic.woff2')
format('woff2');
font-weight: normal;
font-style: italic;
font-display: swap;
}
@font-face {
font-family: 'Phantom Sans';
src: url('https://assets.hackclub.com/fonts/Phantom_Sans_0.7/Bold.woff')
format('woff'),
url('https://assets.hackclub.com/fonts/Phantom_Sans_0.7/Bold.woff2')
format('woff2');
font-weight: bold;
font-style: normal;
font-display: swap;
}
Icons
We have a custom iconset, published as @hackclub/icons.
Explore Hack Club Icons →UI components
Want to make a Hack Club themed site? Use our pre-made CSS and UI components to hackify your site.
Explore Hack Club Theme →Theme Starter on GitHub →CSS Theme on GitHub →