Icon Generator
A webservice for generating PNG icons from icon fonts (Font Awesome etc.).
The original motivation for creating this software was to have a way to easily generate icons for Alfred workflows.
Search icons
Available fonts
These fonts are currently supported by the service. Click the "preview" links to see the each font's icons and their names.
| API name | Website | Preview |
|---|---|---|
elusive |
Elusive Icons | View icons |
fontawesome |
Font Awesome | View icons |
icomoon |
IcoMoon | View icons |
material |
Material Design | View icons |
octicons |
Octicons | View icons |
open-iconic |
Open Iconic | View icons |
typicons |
Typicons | View icons |
weathericons |
Weather Icons | View icons |
Examples
Note: Be aware when mixing icons from different fonts that they can have significantly different sizes. In particular, some, but not all, Typicons are significantly smaller than icons from the other fonts:
| Elusive Icons | Font Awesome | Typicons |
|---|---|---|
Usage
You can create and download icons manually via the web interface or
download them directly with curl or the like.
The URL looks like this:
http://icons.example.com/icon/<fontname>/<csscolour>/<character-name>[/<size>][.png]
| Argument | Description | Examples |
|---|---|---|
fontname |
The name of the font (see above). | fontawesome, elusive |
csscolor |
A CSS color without preceding #. May be 3 or 6 characters, upper- or lowercase. |
FFF, e3a2d1, 000000 |
character-name |
The name of the icon/character. Use the preview links to view available icons and their names. | adult, ban-circle, adjust, youtube |
size (optional, default is 256) |
The size (width = height) of the generated PNG image in pixels. | 64, 512, 1400 |
The server will redirect the client to the actual URL of the image (after it has been generated, if necessary). Thus, the client must follow redirects.
Examples
Download black Apple logo to apple.png:
curl -sSL -o apple.png http://icons.example.com/icon/fontawesome/000/apple
Include icon in HTML:
<img src="http://icons.example.com/icon/fontawesome/666/apple" alt="Apple Logo">
Custom size:
<img src="http://icons.example.com/icon/fontawesome/666/apple/32" alt="Small Apple Logo">
More information
The source code can be found on GitHub.