Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
@font-face {
font-family: 'EntypoRegular';
src: url('font/entypo.eot');
src: url('font/entypo.eot?#iefix') format('embedded-opentype'),
url('font/entypo.woff') format('woff'),
url('font/entypo.ttf') format('truetype'),
url('font/entypo.svg#EntypoRegular') format('svg');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'EntypoSocialRegular';
src: url('font/entypo-social.eot');
src: url('font/entypo-social.eot?#iefix') format('embedded-opentype'),
url('font/entypo-social.woff') format('woff'),
url('font/entypo-social.ttf') format('truetype'),
url('font/entypo-social.svg#EntypoRegular') format('svg');
font-weight: normal;
font-style: normal;
}
.entypo {
font-family: 'EntypoRegular';
font-size: 2em;
font-weight: normal;
line-height: 0;
}
.entypo-social {
font-family: 'EntypoSocialRegular';
font-size: 2em;
font-weight: normal;
line-height: 0;
}
.entypo.phone:before{ content:'\1F4DE'; }
.entypo.mobile:before{ content:'\1F4F1'; }
.entypo.mouse:before{ content:'\E789'; }
.entypo.address:before{ content:'\E723'; }
.entypo.mail:before{ content:'\2709'; }
.entypo.paper-plane:before{ content:'\1F53F'; }
.entypo.pencil:before{ content:'\270E'; }
.entypo.feather:before{ content:'\2712'; }
.entypo.attach:before{ content:'\1F4CE'; }
.entypo.inbox:before{ content:'\E777'; }
.entypo.reply:before{ content:'\E712'; }
.entypo.reply-all:before{ content:'\E713'; }
.entypo.forward:before{ content:'\27A6'; }
.entypo.user:before{ content:'\1F464'; }
.entypo.users:before{ content:'\1F465'; }
.entypo.add-user:before{ content:'\E700'; }
.entypo.vcard:before{ content:'\E722'; }
.entypo.export:before{ content:'\E715'; }
.entypo.location:before{ content:'\E724'; }
.entypo.map:before{ content:'\E727'; }
.entypo.compass:before{ content:'\E728'; }
.entypo.direction:before{ content:'\27A2'; }
.entypo.hair-cross:before{ content:'\1F3AF'; }
.entypo.share:before{ content:'\E73C'; }
.entypo.shareable:before{ content:'\E73E'; }
.entypo.heart:before{ content:'\2665'; }
.entypo.heart-empty:before{ content:'\2661'; }
.entypo.star:before{ content:'\2605'; }
.entypo.star-empty:before{ content:'\2606'; }
.entypo.thumbs-up:before{ content:'\1F44D'; }
.entypo.thumbs-down:before{ content:'\1F44E'; }
.entypo.chat:before{ content:'\E720'; }
.entypo.comment:before{ content:'\E718'; }
.entypo.quote:before{ content:'\275E'; }
.entypo.home:before{ content:'\2302'; }
.entypo.popup:before{ content:'\E74C'; }
.entypo.search:before{ content:'\1F50D'; }
.entypo.flashlight:before{ content:'\1F526'; }
.entypo.print:before{ content:'\E716'; }
.entypo.bell:before{ content:'\1F514'; }
.entypo.link:before{ content:'\1F517'; }
.entypo.flag:before{ content:'\2691'; }
.entypo.cog:before{ content:'\2699'; }
.entypo.tools:before{ content:'\2692'; }
.entypo.trophy:before{ content:'\1F3C6'; }
.entypo.tag:before{ content:'\E70C'; }
.entypo.camera:before{ content:'\1F4F7'; }
.entypo.megaphone:before{ content:'1F4E3'; }
.entypo.moon:before{ content:'\0045'; }
.entypo.palette:before{ content:'\1F3A8'; }
.entypo.leaf:before{ content:'\1F342'; }
.entypo.note:before{ content:'\266A'; }
.entypo.beamed-note:before{ content:'\266B'; }
.entypo.new:before{ content:'\1F4A5'; }
.entypo.graduation-cap:before{ content:'\1F393'; }
.entypo.book:before{ content:'\1F4D5'; }
.entypo.newspaper:before{ content:'\1F4F0'; }
.entypo.bag:before{ content:'\1F45C'; }
.entypo.airplane:before{ content:'\2708'; }
.entypo.lifebuoy:before{ content:'\E788'; }
.entypo.eye:before{ content:'\E70A'; }
.entypo.clock:before{ content:'\1F554'; }
.entypo.mic:before{ content:'\1F3A4'; }
.entypo.calendar:before{ content:'\1F4C5'; }
.entypo.flash:before{ content:'\26A1'; }
.entypo.thunder-cloud:before{ content:'\26C8'; }
.entypo.droplet:before{ content:'\1F4A7'; }
.entypo.cd:before{ content:'\1F4BF'; }
.entypo.briefcase:before{ content:'\1F4BC'; }
.entypo.air:before{ content:'\1F4A8'; }
.entypo.hourglass:before{ content:'\23F3'; }
.entypo.gauge:before{ content:'\1F6C7'; }
.entypo.language:before{ content:'\1F394'; }
.entypo.network:before{ content:'\E776'; }
.entypo.key:before{ content:'\1F511'; }
.entypo.battery:before{ content:'\1F50B'; }
.entypo.bucket:before{ content:'\1F4FE'; }
.entypo.magnet:before{ content:'\E7A1'; }
.entypo.drive:before{ content:'\1F4FD'; }
.entypo.cup:before{ content:'\2615'; }
.entypo.rocket:before{ content:'\1F680'; }
.entypo.brush:before{ content:'\E79A'; }
.entypo.suitcase:before{ content:'\1F6C6'; }
.entypo.traffic-cone:before{ content:'\1F6C8'; }
.entypo.globe:before{ content:'\1F30E'; }
.entypo.keyboard:before{ content:'\2328'; }
.entypo.browser:before{ content:'\E74E'; }
.entypo.publish:before{ content:'\E74D'; }
.entypo.progress-3:before{ content:'\E76B'; }
.entypo.progress-2:before{ content:'\E76A'; }
.entypo.progress-1:before{ content:'\E769'; }
.entypo.progress-0:before{ content:'\E768'; }
.entypo.light-down:before{ content:'\1F505'; }
.entypo.light-up:before{ content:'\1F506'; }
.entypo.adjust:before{ content:'\25D1'; }
.entypo.code:before{ content:'\E714'; }
.entypo.monitor:before{ content:'\1F4BB'; }
.entypo.infinity:before{ content:'\221E'; }
.entypo.light-bulb:before{ content:'\1F4A1'; }
.entypo.credit-card:before{ content:'\1F4B3'; }
.entypo.database:before{ content:'\1F4F8'; }
.entypo.voicemail:before{ content:'\2707'; }
.entypo.clipboard:before{ content:'\1F4CB'; }
.entypo.cart:before{ content:'\E73D'; }
.entypo.box:before{ content:'\1F4E6'; }
.entypo.ticket:before{ content:'\1F3AB'; }
.entypo.rss:before{ content:'\E73A'; }
.entypo.signal:before{ content:'\1F4F6'; }
.entypo.thermometer:before{ content:'\1F4FF'; }
.entypo.water:before{ content:'\1F4A6'; }
.entypo.sweden:before{ content:'\F601'; }
.entypo.line-graph:before{ content:'\1F4C8'; }
.entypo.pie-chart:before{ content:'\25F4'; }
.entypo.bar-graph:before{ content:'\1F4CA'; }
.entypo.area-graph:before{ content:'\1F53E'; }
.entypo.lock:before{ content:'\1F512'; }
.entypo.lock-open:before{ content:'\1F513'; }
.entypo.logout:before{ content:'\E741'; }
.entypo.login:before{ content:'\E740'; }
.entypo.check:before{ content:'\2713'; }
.entypo.cross:before{ content:'\274C'; }
.entypo.squared-minus:before{ content:'\229F'; }
.entypo.squared-plus:before{ content:'\229E'; }
.entypo.squared-cross:before{ content:'\274E'; }
.entypo.circled-minus:before{ content:'\2296'; }
.entypo.circled-plus:before{ content:'\2295'; }
.entypo.circled-cross:before{ content:'\2716'; }
.entypo.minus:before{ content:'\2796'; }
.entypo.plus:before{ content:'\2795'; }
.entypo.erase:before{ content:'\232B'; }
.entypo.block:before{ content:'\1F6AB'; }
.entypo.info:before{ content:'\2139'; }
.entypo.circled-info:before{ content:'\E705'; }
.entypo.help:before{ content:'\2753'; }
.entypo.circled-help:before{ content:'\E704'; }
.entypo.warning:before{ content:'\26A0'; }
.entypo.cycle:before{ content:'\1F504'; }
.entypo.cw:before{ content:'\27F3'; }
.entypo.ccw:before{ content:'\27F2'; }
.entypo.shuffle:before{ content:'\1F500'; }
.entypo.back:before{ content:'\1F519'; }
.entypo.level-down:before{ content:'\21B3'; }
.entypo.retweet:before{ content:'\E717'; }
.entypo.loop:before{ content:'\1F501'; }
.entypo.back-in-time:before{ content:'\E771'; }
.entypo.level-up:before{ content:'\21B0'; }
.entypo.switch:before{ content:'\21C6'; }
.entypo.numbered-list:before{ content:'\E005'; }
.entypo.add-to-list:before{ content:'\E003'; }
.entypo.layout:before{ content:'\268F'; }
.entypo.list:before{ content:'\2630'; }
.entypo.text-doc:before{ content:'\1F4C4'; }
.entypo.text-doc-inverted:before{ content:'\E731'; }
.entypo.doc:before{ content:'\E730'; }
.entypo.docs:before{ content:'\E736'; }
.entypo.landscape-doc:before{ content:'\E737'; }
.entypo.picture:before{ content:'\1F304'; }
.entypo.video:before{ content:'\1F3AC'; }
.entypo.music:before{ content:'\1F3B5'; }
.entypo.folder:before{ content:'\1F4C1'; }
.entypo.archive:before{ content:'\E800'; }
.entypo.trash:before{ content:'\E729'; }
.entypo.upload:before{ content:'\1F4E4'; }
.entypo.download:before{ content:'\1F4E5'; }
.entypo.save:before{ content:'\1F4BE'; }
.entypo.install:before{ content:'\E778'; }
.entypo.cloud:before{ content:'\2601'; }
.entypo.upload-cloud:before{ content:'\E711'; }
.entypo.bookmark:before{ content:'\1F516'; }
.entypo.bookmarks:before{ content:'\1F4D1'; }
.entypo.open-book:before{ content:'\1F4D6'; }
.entypo.play:before{ content:'\25B6'; }
.entypo.paus:before{ content:'\2016'; }
.entypo.record:before{ content:'\25CF'; }
.entypo.stop:before{ content:'\25A0'; }
.entypo.ff:before{ content:'\23E9'; }
.entypo.fb:before{ content:'\23EA'; }
.entypo.to-start:before{ content:'\23EE'; }
.entypo.to-end:before{ content:'\23ED'; }
.entypo.resize-full:before{ content:'\E744'; }
.entypo.resize-small:before{ content:'\E746'; }
.entypo.volume:before{ content:'\23F7'; }
.entypo.sound:before{ content:'\1F50A'; }
.entypo.mute:before{ content:'\1F507'; }
.entypo.flow-cascade:before{ content:'\1F568'; }
.entypo.flow-branch:before{ content:'\1F569'; }
.entypo.flow-tree:before{ content:'\1F56A'; }
.entypo.flow-line:before{ content:'\1F56B'; }
.entypo.flow-parallel:before{ content:'\1F56C'; }
.entypo.left-bold:before{ content:'\E4AD'; }
.entypo.down-bold:before{ content:'\E4B0'; }
.entypo.up-bold:before{ content:'\E4AF'; }
.entypo.right-bold:before{ content:'\E4AE'; }
.entypo.left:before{ content:'\2B05'; }
.entypo.down:before{ content:'\2B07'; }
.entypo.up:before{ content:'\2B06'; }
.entypo.right:before{ content:'\27A1'; }
.entypo.circled-left:before{ content:'\E759'; }
.entypo.circled-down:before{ content:'\E758'; }
.entypo.circled-up:before{ content:'\E75B'; }
.entypo.circled-right:before{ content:'\E75A'; }
.entypo.triangle-left:before{ content:'\25C2'; }
.entypo.triangle-down:before{ content:'\25BE'; }
.entypo.triangle-up:before{ content:'\25B4'; }
.entypo.triangle-right:before{ content:'\25B8'; }
.entypo.chevron-left:before{ content:'\E75D'; }
.entypo.chevron-down:before{ content:'\E75C'; }
.entypo.chevron-up:before{ content:'\E75F'; }
.entypo.chevron-right:before{ content:'\E75E'; }
.entypo.chevron-small-left:before{ content:'\E761'; }
.entypo.chevron-small-down:before{ content:'\E760'; }
.entypo.chevron-small-up:before{ content:'\E763'; }
.entypo.chevron-small-right:before{ content:'\E762'; }
.entypo.chevron-thin-left:before{ content:'\E765'; }
.entypo.chevron-thin-down:before{ content:'\E764'; }
.entypo.chevron-thin-up:before{ content:'\E767'; }
.entypo.chevron-thin-right:before{ content:'\E766'; }
.entypo.left-thin:before{ content:'\2190'; }
.entypo.down-thin:before{ content:'\2193'; }
.entypo.up-thin:before{ content:'\2191'; }
.entypo.right-thin:before{ content:'\2192'; }
.entypo.arrow-combo:before{ content:'\E74F'; }
.entypo.three-dots:before{ content:'\23F6'; }
.entypo.two-dots:before{ content:'\23F5'; }
.entypo.dot:before{ content:'\23F4'; }
.entypo.cc:before{ content:'\1F545'; }
.entypo.cc-by:before{ content:'\1F546'; }
.entypo.cc-nc:before{ content:'\1F547'; }
.entypo.cc-nc-eu:before{ content:'\1F548'; }
.entypo.cc-nc-jp:before{ content:'\1F549'; }
.entypo.cc-sa:before{ content:'\1F54A'; }
.entypo.cc-nd:before{ content:'\1F54B'; }
.entypo.cc-pd:before{ content:'\1F54C'; }
.entypo.cc-zero:before{ content:'\1F54D'; }
.entypo.cc-share:before{ content:'\1F54E'; }
.entypo.cc-remix:before{ content:'\1F54F'; }
.entypo.db-logo:before{ content:'\1F5F9'; }
.entypo.db-shape:before{ content:'\1F5FA'; }
.entypo-social.github:before{ content:'\F300'; }
.entypo-social.c-github:before{ content:'\F301'; }
.entypo-social.flickr:before{ content:'\F303'; }
.entypo-social.c-flickr:before{ content:'\F304'; }
.entypo-social.vimeo:before{ content:'\F306'; }
.entypo-social.c-vimeo:before{ content:'\F307'; }
.entypo-social.twitter:before{ content:'\F309'; }
.entypo-social.c-twitter:before{ content:'\F30A'; }
.entypo-social.facebook:before{ content:'\F30C'; }
.entypo-social.c-facebook:before{ content:'\F30D'; }
.entypo-social.s-facebook:before{ content:'\F30E'; }
.entypo-social.google+:before{ content:'\F30F'; }
.entypo-social.c-google+:before{ content:'\F310'; }
.entypo-social.pinterest:before{ content:'\F312'; }
.entypo-social.c-pinterest:before{ content:'\F313'; }
.entypo-social.tumblr:before{ content:'\F315'; }
.entypo-social.c-tumblr:before{ content:'\F316'; }
.entypo-social.linkedin:before{ content:'\F318'; }
.entypo-social.c-linkedin:before{ content:'\F319'; }
.entypo-social.dribbble:before{ content:'\F31B'; }
.entypo-social.c-dribbble:before{ content:'\F31C'; }
.entypo-social.stumbleupon:before{ content:'\F31E'; }
.entypo-social.c-stumbleupon:before{ content:'\F31F'; }
.entypo-social.lastfm:before{ content:'\F321'; }
.entypo-social.c-lastfm:before{ content:'\F322'; }
.entypo-social.rdio:before{ content:'\F324'; }
.entypo-social.c-rdio:before{ content:'\F325'; }
.entypo-social.spotify:before{ content:'\F327'; }
.entypo-social.c-spotify:before{ content:'\F328'; }
.entypo-social.qq:before{ content:'\F32A'; }
.entypo-social.instagram:before{ content:'\F32D'; }
.entypo-social.dropbox:before{ content:'\F330'; }
.entypo-social.evernote:before{ content:'\F333'; }
.entypo-social.flattr:before{ content:'\F336'; }
.entypo-social.skype:before{ content:'\F339'; }
.entypo-social.c-skype:before{ content:'\F33A'; }
.entypo-social.renren:before{ content:'\F33C'; }
.entypo-social.sina-weibo:before{ content:'\F33F'; }
.entypo-social.paypal:before{ content:'\F342'; }
.entypo-social.picasa:before{ content:'\F345'; }
.entypo-social.soundcloud:before{ content:'\F348'; }
.entypo-social.mixi:before{ content:'\F34B'; }
.entypo-social.behance:before{ content:'\F34E'; }
.entypo-social.google-circles:before{ content:'\F351'; }
.entypo-social.vk:before{ content:'\F354'; }
.entypo-social.smashing:before{ content:'\F357'; }
@mklb

This comment has been minimized.

Copy link

@mklb mklb commented Apr 5, 2013

Hey, great work!

Please correct "moon" - its '\263D'
Thanks

@somegoodpixels

This comment has been minimized.

Copy link

@somegoodpixels somegoodpixels commented Jun 9, 2013

Love this!

Megaphone is \1F4E3

@softvar

This comment has been minimized.

Copy link

@softvar softvar commented Aug 11, 2013

Worked perfectly!
Thanks a lot!

@cle-ment

This comment has been minimized.

Copy link

@cle-ment cle-ment commented Aug 16, 2013

thanks, perfect!

@Ycfx

This comment has been minimized.

Copy link

@Ycfx Ycfx commented Sep 9, 2013

Thanks a lot !

@kenlangston

This comment has been minimized.

Copy link

@kenlangston kenlangston commented Oct 14, 2013

How do you reference the font in the html code?

@rtexal

This comment has been minimized.

Copy link

@rtexal rtexal commented Oct 15, 2013

@kenlangston , class="entypo [icon name e.g. search]"

@drsii

This comment has been minimized.

Copy link

@drsii drsii commented Oct 22, 2013

This is great, however quite a few showing up as illegal characters in iOS.

@jbdelhommeau

This comment has been minimized.

Copy link

@jbdelhommeau jbdelhommeau commented Nov 4, 2013

Nice good job :)

@moritzjacobs

This comment has been minimized.

Copy link

@moritzjacobs moritzjacobs commented Nov 22, 2013

<3

@tom-egolf4u

This comment has been minimized.

Copy link

@tom-egolf4u tom-egolf4u commented Dec 6, 2013

Thanks!

@ghost

This comment has been minimized.

Copy link

@ghost ghost commented Dec 6, 2013

hello guys, it works well with the entypo font policy (by the way awsome and usefull design) but not with the social one on chrome (release 31.0.1650.63 m) (policies files downloaded from http://entypo.com/), is it happened to you?

@TorbenKoehn

This comment has been minimized.

Copy link

@TorbenKoehn TorbenKoehn commented Jan 16, 2014

Thanks for this!

@thasmo

This comment has been minimized.

Copy link

@thasmo thasmo commented Jan 17, 2014

Awesome! Really!

@michaelzoidl

This comment has been minimized.

Copy link

@michaelzoidl michaelzoidl commented Feb 10, 2014

Awesome! Thanks :)

@Dsyko

This comment has been minimized.

Copy link

@Dsyko Dsyko commented Mar 1, 2014

Thanks for this! I've created a package for a javascript framework called Meteor, and this came in handy. I've added the "entypo-" prefix to the icon names just to avoid treading on other css classes which might be similar. Check it out here if you want: http://dsyko.github.io/meteor-entypo/

@shofer4eto

This comment has been minimized.

Copy link

@shofer4eto shofer4eto commented Mar 9, 2014

Hi,

Great stuff thanks, I am having a problem viewing some (yes, strange enough, only some) of the icons on an Anrdoid 4 phone though! Anyone having the same issue? For example 'phone' and 'mobile' don't show correctly...
Thanks!

@kflorence

This comment has been minimized.

Copy link

@kflorence kflorence commented Mar 26, 2014

.entypo-social.google+:before{ content:'\F30F'; }

"google+" is not a valid classname, the "+" must be escaped:

.entypo-social.google\+:before{ content:'\F30F'; }
@megawac

This comment has been minimized.

Copy link

@megawac megawac commented May 10, 2014

most other frameworks write it google-plus also thanks, this is great

@bdemauroh

This comment has been minimized.

Copy link

@bdemauroh bdemauroh commented Jul 14, 2014

Thanks!

@nravichandra

This comment has been minimized.

Copy link

@nravichandra nravichandra commented Jul 22, 2014

Thanks alot

@thlgrant

This comment has been minimized.

Copy link

@thlgrant thlgrant commented Aug 3, 2014

Thanks bro!

@kalwalkden

This comment has been minimized.

Copy link

@kalwalkden kalwalkden commented Aug 27, 2014

Thank you!

@martonlente

This comment has been minimized.

Copy link

@martonlente martonlente commented Sep 3, 2014

I've faced that it works fine with all the important browsers except Opera. Has somebody faced this as well maybe finding a solution? Otherwise it's just great, thank you!

@tlc033

This comment has been minimized.

Copy link

@tlc033 tlc033 commented Oct 30, 2014

Way you don't have Youtube?

@ghost

This comment has been minimized.

Copy link

@ghost ghost commented Jul 24, 2017

is there an api ?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment