Geomicons

Open Source Icons for the Web

Fast, Plain & Simple

Smaller than similar webfonts and with fewer network requests than other solutions, Geomicons Open is built from the ground up for performance. Designed on a grid for pixel-precision at standard sizes, each icon is hand-coded to avoid the extra bloat from traditional vector drawing applications.

Getting Started

Download the source or grab Geomicons Open from one of these sources:

git clone https://github.com/jxnblk/geomicons-open.git
npm install geomicons-open
<link rel="stylesheet" href="http://d2v52k3cl9vedd.cloudfront.net/geomicons/0.2.0/geomicons.min.js">

Add a data-icon attribute with the name of the icon to inject.

<span class="js-geomicon" data-icon="heart"></span>

Pass a nodelist to the Geomicons.inject() method.

<script>
  var icons = document.querySelectorAll('.js-geomicon');
  Geomicons.inject(icons);
</script>

Style with CSS

<style>
  .geomicon { width: 1em; height: 1em; }
  .red { color: red }
</style>
<span class="js-geomicon geomicon red" data-id="heart"></span>

Or, if you’re just using one or two, copy and paste the SVG code from the icons on this page.

Learn More

Download and learn more about how to use Geomicons on Github.

View on Github

Other Geomicons Products

Toast Test