Zum Inhalt springen
IconHub

The IconHub brand

One ink tile, one jade accent, plenty of white. The Grid mark shows a library of icons with one of them picked. Use these files when you write about IconHub or link to it.

Logo files

LogoLogoMark and wordmark, for light backgrounds.PNG
Logo, reversedLogo, reversedFor ink and dark photos.PNG
Mark, one colorMark, one colorPrint, stamps, single-ink use.SVG

Using the logo

IconHub

Keep a quarter of the mark’s height clear on every side. Don’t set the mark below 16 px or the logo below 96 px wide.

  • Don’t stretch, squash or rotate the mark.
  • Don’t change the tile color; use the reversed file on dark backgrounds.
  • Don’t place the logo on busy or low-contrast backgrounds.
  • Don’t add shadows, outlines or effects.

Color

Ink and white do most of the work. Jade is the only accent: one spark per screen, never a background for long text.

Ink#0C1110Text, buttons, the tile
Jade#00BC7DThe one accent
Mint#E8F7F0Soft fills
Mint 2#DFF4EASelected rows
Paper#F5F7F6Panels
Line#E6E9E7Borders

Typography

Inter for everything: heavy, tightly spaced headlines and relaxed body text.

Icons for every ideaDisplay · Inter 800 · 56 / −5%
Most used kitsHeading · Inter 800 · 32 / −3.5%
Restyle a whole kitTitle · Inter 700 · 18
Copy any icon as SVG, recolor it, or download the whole kit.Body · Inter 400 · 16 / 1.6
Outline · 1,541 iconsMeta · Inter 400 · 13

Loading

The same six states run across the site, from the first visit to a button press.

Mark drawPages while they render.
Mark beatShort waits.
Icon gridSearch results.
Top barEvery page change.
Skeleton tilesGrids filling in.
Building ZIPButtonDownloads and actions.