Genericons font
![Genericons](https://hackfonts.com/data/43/g/genericons/genericons.png)
Font name: Genericons
Font style: Regular
Basic font information
Font family: Genericons
Font subfamily identification: Regular
Unique identifier: 2.005;UKWN;Genericons-Regular
Full font name: Genericons
Version: Version 2.005;PS 002.005;hotconv 1.0.56;makeotf.lib2.0.21325
Postscript font name: Genericons-Regular
Designer: Joen Asmussen
Genericons Regular
- Styles
- Charmap
- Genericons-Regular
OTF (11.5 Kb)
![Genericons](data/43/g/genericons/map/0-charmap-genericons.png)
![Genericons](data/43/g/genericons/map/1-charmap-genericons.png)
![Genericons](data/43/g/genericons/map/2-charmap-genericons.png)
Read more
___ ____ __ _ ____ ____ __ ___ __ __ _ ____
/ __)( __)( ( \( __)( _ \( )/ __)/ \ ( ( \/ ___)
( (_ \ ) _) / / ) _) ) / )(( (__( O )/ /\___ \
\___/(____)\_)__)(____)(__\_)(__)\___)\__/ \_)__)(____/
Genericons are vector icons embedded in a webfont designed to be clean and simple keeping with a generic aesthetic.
Use genericons for instant HiDPI, to change icon colors on the fly, or even with CSS effects such as drop-shadows or gradients!
_ _ ____ ____ ____ ____
| | [__ |__| | __ |___
|__| ___] | | |__] |___
To use it, place the font folder in your stylesheet directory and paste this in your CSS file:
/* =Genericons, thanks to FontSquirrel.com for conversion!
-------------------------------------------------------------- */
@font-face {
font-family: 'Genericons';
src: url('font/genericons-regular-webfont.eot');
src: url('font/genericons-regular-webfont.eot?#iefix') format('embedded-opentype'),
url('font/genericons-regular-webfont.woff') format('woff'),
url('font/genericons-regular-webfont.ttf') format('truetype'),
url('font/genericons-regular-webfont.svg#genericonsregular') format('svg');
font-weight: normal;
font-style: normal;
}
Note: the above only works if you don't use a CDN. If you do, or don't know what that is, you should use the syntax that's embedded in genericons.css.
From then on, you can create an icon like this:
.my-icon:before {
content: '\f101';
display: inline-block;
-webkit-font-smoothing: antialiased;
font: normal 16px/1 'Genericons';
vertical-align: top;
}
This will output a comment icon before every element with the class "my-icon". The "content: '\f101';" part of this CSS is easily copied from the helper tool at http://genericons.com/
You can also use the bundled example.css if you'd rather insert the icons using HTML tags.
_ _ ____ ___ ____ ____
|\ | | | | |___ [__
| \| |__| | |___ ___]
Genericons-Regular.otf found in the root directory of this zip has not been web-font-ified. So you can drop it in your system fonts folder and use the font in Photoshop if you like.
Note that Genericons has been designed for a 16x16 pixel grid. That means it'll look sharp at font-size: 16px exactly. It'll also be crisp at multiples thereof, such as 32px or 64px. It'll also look reasonably crisp at in-between font sizes such as 24px or 48px, but not quite as crisp as 16 or 32. Please don't set the font-size to 17px, though, that'll just look terrible.
Also note the CSS property "-webkit-font-smoothing: antialiased". That makes the icons look great in WebKit browsers. Please see http://noscope.com/2012/font-smoothing for more info.
____ _ _ ____ _ _ ____ ____ _ ____ ____
| |__| |__| |\ | | __ |___ | | | | __
|___ | | | | | \| |__] |___ |___ |__| |__]
V2.06:
Included Base64 encoded version. This is necessary for Genericons to work with CDNs in Firefox. Firefox blocks fonts linked from a different domain. A CDN (typically s.example.com) usually puts the font on a subdomain, and is hence blocked in Firefox.
V2.05:
Added a bunch of new icons, including upload to cloud, download to cloud, many more.
V2:
Initial public release
- Font
- Alien
- Ancient
- Android fonts
- Animals
- Basic
- Blurred
- Brush
- Celtic
- Chalk Crayon
- Comic
- Curly
- Decorative
- Dingbats
- Distorted
- Dotted
- Eroded
- Esoteric
- Famous
- Fancy
- Font 3D
- Gothic
- Graffiti
- Grid
- Groovy
- Grunge/Trash
- Headline
- Italic
- Lefty
- Logos
- Mac OS
- Medieval
- Modern
- Old School
- Outline
- Retro
- Rounded
- Runes, Elvish
- Sans serif
- Scratched
- Script
- Shapes
- Stencil, Army
- Typerwriter
- Western
- Wild West
- Various
- Holiday
- Art
- Techno
- People
- Relax
- Foreign