fortawesome / font-awesome Goto Github PK

View Code? Open in Web Editor NEW

73.0K 73.0K 12.2K 117.03 MB

The iconic SVG, font, and CSS toolkit

Home Page: https://fontawesome.com

License: Other

CSS 7.22% JavaScript 78.31% Less 7.10% SCSS 7.38%

css font fontawesome icons svg-icons svg-sprites webfont

font-awesome's People

Contributors

Stargazers

Watchers

Forkers

bochenn hippich ericdfields samvj tantalor pol kalyse marioricalde jogloran mechanism l4u protez kranthikumar emaxerrno jyothepro bronfman mandric maheshbabu dkris emilis amitagrawal teckx5 thechronos antzucaro katelyn damajor lukavida cpatni saidimu tripitch-mediacreatives quickredfox joedevon friedwishes mmmert benrwallace seektan coder-zhi geekontheway gmimano ilpredo cordoval hudsonperalta tofer tquensen sannorozco tommyent rajdn ajkorf toke laguna501 creatrice charlesmchen xiaoche franzpoize bootstrap202 mime55 zerodev d060703 jc1arke jecons studentdeng elsewares railsdev piranxa danawoodman biojazzard jag kubaf gijs 3l13 gnu-user natos billortell ika18 credochen chaonextdoor nikkibu azadious guoguo marleenvandenbrand suupic contextworks netconstructor loqman projectbbs leecade phpnode viruthagiri seanli mnishihan vinothshankaran paulendaya altruity andrewrodgerscmg cicloid libin phastafrican aparikh bootstrap203 gregoryloucas

font-awesome's Issues

Telefon Icon

Hi,

nice collection of icons! But no telefon icon included? Would be nice to see that in future releases.

Cheers
Mario

Sync icons with the Noun Project

http://thenounproject.com/

Both projects seek to come up with a common language for many iconic terms. The bug is to make sure that the icons that refer to the same elements are "sync'd" between the two projects.

icon-phone

First, thank you, most awesome!

Would love a phone icon like an old style handset: perhaps something like this? http://www.clker.com/clipart-12243.html

Icon request: icon-gamepad

Icons that represent games and game-related activities would be a worthwhile addition. The current trophy and flag icons help fulfill this need, but a gamepad or similar would be valuable.

I am having trouble getting the fonts to display in IE9. I just posted a question about it on Stack (http://bit.ly/ycH07d). I created a Fiddle to showcase the problem. Works great in Chrome, but IE, not so much. Can someone provide help please? I really would like to use this! Font icons are awesome...

icon-pdf

A great addition would be a pdf icon, which could be applied to links for opening a pdf, since many browsers open pdf's inside the browser so a download icon won't make sense.

13 Icon Suggestions: Based on needs of web apps/sites

Here are some icon suggestions for you to review - along with a small description of why they would be needed in a web app :

~~man: For gender variety to the user icons.~~ #475
~~woman: For gender variety to the user icons.~~ #475
~~notes: For notes. (There are file and book but no notes.)~~ #896
~~attach: Again, this is very needed for attachments.~~ Done
~~history: For version tracking, etc.~~ #895
~~charts: For stats, charts, etc. (The current chart icon doesn't look clear on smaller sizes, maybe something without a border?)~~ #171
~~adress_book and/or vcard: To represent "contact" or "address book".~~ #898
~~unshare: For "undo" or "unshare" operations and to accompany the share/redo icon.~~ #899
~~pin: For pinning or sticky commands. (Maybe a simpler and 2D looking one, as an alternative to yours?)~~ newest one is 2D
~~envelope_read: To represent an open/read mail.~~ #897
~~coin(s): For payment options.~~ #584
~~clipboard:~~ icon-paste should do
~~calculator~~ #521

Thanks again for your already great work!

add docs to the repo?

so we can optionally browse the site/docs/examples locally.

Icon request: icon-bitbucket

I use both github and bitbucket and it would be great to have the latter added to the available icons.

Conflict with Twitter Bootstrap Glyphicon

It's probably a noob issue but since I integrated Font Awesome in my project which has already Twitter Bootstrap, the icons that have the same name between FW et TB appears overrided (TB one under FW one).

How to fix that ?

SASS version?

Some, like us are using bootstrap-sass. It'd be great if there was a sass port of this.

Icon request: icon-smile, icon-frown, icon-meh

Would love an icon that could be used to express 'maybe', 'kinda', 'sorta', 'meh' non-committal fuzziness.

The tilde character ~ would seem to fit the bill.

Thanks and I'm looking forward to playing around with Font-Awesome.

icon-googleplus-sign

It would be great to have a Google+ icon as well as Facebook and Twitter. Thanks.

Icon request: icon-location-arrow

It would be great to include some geo-location icons.

A "request geolocation" icon. Chrome displays a geo-location icon in the search box when the web site is given access to geolocation services. Android also uses a similar version of this icon in the status bar when geolocation is enabled.
A "show on map" icon, similar to google maps marker. This icon can be used on buttons that request display if the relevant item on a map.

Icon request: icon-forward, icon-reply-all

It would be nice to have an icon that suggests forwarding an e-mail. Perhaps something like:

http://cdn1.iconfinder.com/data/icons/Primo_Icons/PNG/128x128/email_forward.png

Social Icons without a box

It would be nice to get the Icons for Google+ (the new g+ instead of +), Twitter and Facebook without a square in the background.

Feed icon is missing.

What can I do to rectify this?

Icon request: icon-play-loop

Suggestion for a repeat/loop icon in a similar style to the icon-play / icon-pause etc

Shadowing effect

I'm getting a shadowing effect when using Font-Awesome: http://i.imgur.com/dnLZC.jpg with a default Bootstrap-enabled Bolierplate index file: https://gist.github.com/1989899

Copying code direct from http://fortawesome.github.com/Font-Awesome/ and there appears to be spacing issues as well.

Running Google Chrome 17.0.963.66, Mac OS X Lion

Icon request: icon-terminal, icon-code

How about?

A beaker
A chromosome
An atom
A pipette
A command prompt (a la Terminal in OSX)
Code
CPU
Monitor
A cell.
File

icon-check-empty

Simply the empty box of icon-check. ie; same dimensions.

IE 7 support for icons in bootstrap

While @font-face is technically supported in older versions of IE, the use of the :before selector is not supported and so setting icons in buttons for bootstrap using the default technique (relying on :before and content) does not work. After considerable research, the simplest solution we found was to create an ie7 specific css file using an expression. We did not test in versions prior to IE 7 but theoretically it should work for at least some of them. I used a regex in my text editor to modify the icon list and then added a couple of required css classes to fix things up.

Here is how it works:

<!--[if IE 7]><link rel="stylesheet" href="/stylesheets/font-awesome-ie7.css"><![endif]-->

font-awesome-ie7.css contents:

[class^="icon-"],
[class*=" icon-"] {
    font-family: FontAwesome;
    font-style: normal;
    font-weight: normal;
}

.icon-large {
    font-size: 1.3333em;
}


.icon-glass { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf000;&nbsp;'); }
.icon-music { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf001;&nbsp;'); }
.icon-search { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf002;&nbsp;'); }
.icon-envelope { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf003;&nbsp;'); }
.icon-heart { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf004;&nbsp;'); }
.icon-star { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf005;&nbsp;'); }
.icon-star-empty { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf006;&nbsp;'); }
.icon-user { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf007;&nbsp;'); }
.icon-film { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf008;&nbsp;'); }
.icon-th-large { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf009;&nbsp;'); }
.icon-th { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf00a;&nbsp;'); }
.icon-th-list { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf00b;&nbsp;'); }
.icon-ok { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf00c;&nbsp;'); }
.icon-remove { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf00d;&nbsp;'); }
.icon-zoom-in { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf00e;&nbsp;'); }

.icon-zoom-out { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf010;&nbsp;'); }
.icon-off { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf011;&nbsp;'); }
.icon-signal { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf012;&nbsp;'); }
.icon-cog { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf013;&nbsp;'); }
.icon-trash { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf014;&nbsp;'); }
.icon-home { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf015;&nbsp;'); }
.icon-file { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf016;&nbsp;'); }
.icon-time { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf017;&nbsp;'); }
.icon-road { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf018;&nbsp;'); }
.icon-download-alt { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf019;&nbsp;'); }
.icon-download { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf01a;&nbsp;'); }
.icon-upload { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf01b;&nbsp;'); }
.icon-inbox { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf01c;&nbsp;'); }
.icon-play-circle { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf01d;&nbsp;'); }
.icon-repeat { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf01e;&nbsp;'); }

.icon-refresh { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf021;&nbsp;'); }
.icon-list-alt { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf022;&nbsp;'); }
.icon-lock { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf023;&nbsp;'); }
.icon-flag { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf024;&nbsp;'); }
.icon-headphones { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf025;&nbsp;'); }
.icon-volume-off { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf026;&nbsp;'); }
.icon-volume-down { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf027;&nbsp;'); }
.icon-volume-up { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf028;&nbsp;'); }
.icon-qrcode { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf029;&nbsp;'); }
.icon-barcode { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf02a;&nbsp;'); }
.icon-tag { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf02b;&nbsp;'); }
.icon-tags { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf02c;&nbsp;'); }
.icon-book { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf02d;&nbsp;'); }
.icon-bookmark { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf02e;&nbsp;'); }
.icon-print { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf02f;&nbsp;'); }

.icon-camera { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf030;&nbsp;'); }
.icon-font { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf031;&nbsp;'); }
.icon-bold { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf032;&nbsp;'); }
.icon-italic { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf033;&nbsp;'); }
.icon-text-height { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf034;&nbsp;'); }
.icon-text-width { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf035;&nbsp;'); }
.icon-align-left { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf036;&nbsp;'); }
.icon-align-center { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf037;&nbsp;'); }
.icon-align-right { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf038;&nbsp;'); }
.icon-align-justify { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf039;&nbsp;'); }
.icon-list { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf03a;&nbsp;'); }
.icon-indent-left { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf03b;&nbsp;'); }
.icon-indent-right { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf03c;&nbsp;'); }
.icon-facetime-video { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf03d;&nbsp;'); }
.icon-picture { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf03e;&nbsp;'); }

.icon-pencil { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf040;&nbsp;'); }
.icon-map-marker { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf041;&nbsp;'); }
.icon-adjust { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf042;&nbsp;'); }
.icon-tint { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf043;&nbsp;'); }
.icon-edit { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf044;&nbsp;'); }
.icon-share { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf045;&nbsp;'); }
.icon-check { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf046;&nbsp;'); }
.icon-move { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf047;&nbsp;'); }
.icon-step-backward { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf048;&nbsp;'); }
.icon-fast-backward { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf049;&nbsp;'); }
.icon-backward { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf04a;&nbsp;'); }
.icon-play { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf04b;&nbsp;'); }
.icon-pause { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf04c;&nbsp;'); }
.icon-stop { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf04d;&nbsp;'); }
.icon-forward { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf04e;&nbsp;'); }

.icon-fast-forward { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf050;&nbsp;'); }
.icon-step-forward { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf051;&nbsp;'); }
.icon-eject { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf052;&nbsp;'); }
.icon-chevron-left { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf053;&nbsp;'); }
.icon-chevron-right { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf054;&nbsp;'); }
.icon-plus-sign { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf055;&nbsp;'); }
.icon-minus-sign { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf056;&nbsp;'); }
.icon-remove-sign { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf057;&nbsp;'); }
.icon-ok-sign { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf058;&nbsp;'); }
.icon-question-sign { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf059;&nbsp;'); }
.icon-info-sign { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf05a;&nbsp;'); }
.icon-screenshot { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf05b;&nbsp;'); }
.icon-remove-circle { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf05c;&nbsp;'); }
.icon-ok-circle { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf05d;&nbsp;'); }
.icon-ban-circle { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf05e;&nbsp;'); }

.icon-arrow-left { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf060;&nbsp;'); }
.icon-arrow-right { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf061;&nbsp;'); }
.icon-arrow-up { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf062;&nbsp;'); }
.icon-arrow-down { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf063;&nbsp;'); }
.icon-share-alt { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf064;&nbsp;'); }
.icon-resize-full { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf065;&nbsp;'); }
.icon-resize-small { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf066;&nbsp;'); }
.icon-plus { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf067;&nbsp;'); }
.icon-minus { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf068;&nbsp;'); }
.icon-asterisk { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf069;&nbsp;'); }
.icon-exclamation-sign { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf06a;&nbsp;'); }
.icon-gift { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf06b;&nbsp;'); }
.icon-leaf { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf06c;&nbsp;'); }
.icon-fire { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf06d;&nbsp;'); }
.icon-eye-open { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf06e;&nbsp;'); }

.icon-eye-close { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf070;&nbsp;'); }
.icon-warning-sign { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf071;&nbsp;'); }
.icon-plane { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf072;&nbsp;'); }
.icon-calendar { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf073;&nbsp;'); }
.icon-random { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf074;&nbsp;'); }
.icon-comment { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf075;&nbsp;'); }
.icon-magnet { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf076;&nbsp;'); }
.icon-chevron-up { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf077;&nbsp;'); }
.icon-chevron-down { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf078;&nbsp;'); }
.icon-retweet { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf079;&nbsp;'); }
.icon-shopping-cart { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf07a;&nbsp;'); }
.icon-folder-close { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf07b;&nbsp;'); }
.icon-folder-open { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf07c;&nbsp;'); }
.icon-resize-vertical { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf07d;&nbsp;'); }
.icon-resize-horizontal { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf07e;&nbsp;'); }

.icon-bar-chart { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf080;&nbsp;'); }
.icon-twitter-sign { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf081;&nbsp;'); }
.icon-facebook-sign { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf082;&nbsp;'); }
.icon-camera-retro { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf083;&nbsp;'); }
.icon-key { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf084;&nbsp;'); }
.icon-cogs { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf085;&nbsp;'); }
.icon-comments { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf086;&nbsp;'); }
.icon-thumbs-up { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf087;&nbsp;'); }
.icon-thumbs-down { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf088;&nbsp;'); }
.icon-star-half { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf089;&nbsp;'); }
.icon-heart-empty { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf08a;&nbsp;'); }
.icon-signout { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf08b;&nbsp;'); }
.icon-linkedin-sign { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf08c;&nbsp;'); }
.icon-pushpin { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf08d;&nbsp;'); }
.icon-external-link { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf08e;&nbsp;'); }

.icon-signin { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf090;&nbsp;'); }
.icon-trophy { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf091;&nbsp;'); }
.icon-github-sign { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf092;&nbsp;'); }
.icon-upload-alt { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf093;&nbsp;'); }
.icon-lemon { *zoom: expression( this.runtimeStyle['zoom'] = "1", this.innerHTML = '&#xf094;&nbsp;'); }

icon request: email icon

icon-sort

We are trying to add in up, down and up-down-unselected sort markers for table columns. We have graphics that we are using for it, but if we use Font Awesome in other places on the site, it would make sense to use it here as well. Plus, I think it would be a great addition and used by many other people.

Using correct class-matchers

Small mistake in the class matching, using only [class^="icon-"] will not work. Just like in the original sprite.less you need to use

[class^="icon-"],
[class*=" icon-"]

And there it works :)

Icon request: search - magnifying glass

Just like the one at the top right on apple.com. Thank you for your amazing work and making it available to all of us for free...

icon-game

Another good one, which could be used in like a web application or a blog. Would be similar to the 'icon-film' concept, but how to design it, not really sure. Maybe a console controller.

icon-money

This would be very useful. Perhaps a stack of coins or a note would be good.
Thanks for all the hard work put into this already!

Conflict with Bootstrap sprites?

I've just added the fontawesome css file and font assets, but bootstrap is still applying the background image sprites.

Shouldn't fontawesome.css override the background-image and background-postion attributes from the standard bootstrap.css?

icon-phone-sign

An icon for contacting via phone. Something like these:
https://www.google.com/search?q=call&hl=en&prmd=imvnsza&source=lnms&tbm=isch&ei=W8BXT77zJsiOiALKhPWFCw&sa=X&oi=mode_link&ct=mode&cd=2&ved=0CBUQ_AUoAQ&biw=1024&bih=1064#q=call&hl=en&tbm=isch&prmd=imvnsza&source=lnt&tbs=isz:i&sa=X&ei=XcBXT4LIOeSOiALJseTKCw&ved=0CA8QpwUoAw&bav=on.2,or.r_gc.r_pw.r_cp.r_qf.,cf.osb&fp=16abf2b338ddaa1c&biw=1024&bih=1064

Icon request: icon-train

Since there is a plane - it would be nice to have the travel set
hotel, train

basic icon animation classes

Why there isn't any icon with ajax loader (animated .gif)? Please add several variations.

Unable to add TTF to Font Book on OSX

I'd like to utilize Font Awesome within comps, but I haven't been able to successfully add Font Awesome to Font Book on OSX, specifically the TTF. Is there a version available that works well with desktops?

icon-pinterest-sign

icon-globe

A globe icon representing the world, something that could maybe be used for location selection or representing global attributes (similar to the "hide personal results" globe in Google searches).

icon request: clock/time icon

Great font, by the way -- thank you and congratulations.

Sam

Idea: make Font-Awesome available via Google WebFonts

http://www.google.com/webfonts have a wide selection but miss a pictogram font. They also highlight Kickstart projects for fonts to be included in their library ($3k on average).

Including Font-Awesome in Google WebFonts would make it available to many, and possibly result in it becoming a de-facto standard on the web.

"retweet" icon rotated by 90deg?

I'm not sure if this was intended, but looks like the retweet icon is currently rotated by 90 degrees, ie, its in portrait mode, while the original icon is in landscape.

No big deal, just thought I would point this out - in case this was by mistake.

Icon request: Collapse/Expand

Thanks so much for starting this. It's going to be immensely useful for my bootstrap projects.

Would you consider adding collapse and expand icons to the font? For example: http://findicons.com/icon/440748/collapse_arrow_alt?id=440748 and http://findicons.com/icon/440666/collapse_alt

Documentation update about IE support

Ie4+ supports font-face, but IE7 and below doesn't support the pseudo elements :before and :after. Because Font Awesome uses :before to insert the unicode characters IE7 and below aren't supported.

I think it would be nice if that's made clearer on http://fortawesome.github.com/Font-Awesome/

missing google+

g or g+ icon

Where is my coffee cup?

Icon suggestion:

Coffee cup
TV
Radio
Brightness up and down
Wheelchair (Disability sign)
Men
Women

Icon request: file types

Some icons representing common types of files would be nice, e.g.:

pdf
xls
doc
txt
image (png, jpg)

Source for the font itself ?

It would be interesting to know how the font got composed. Can each glyph be worked on it's own and then use a script to merge them to the character table, and then output the various font formats ?

A notice on overcrowding

A lot of the issues that have been submited recently have been on adding more and more icons on various subjects and themes that range from the common use to the far fetched personal need.

I think we all need to remember that this font was - in my mind - designed first as a tool for web design, to replace sprite icons. It was based on the Bootstrap project and thus it's not made for use out of that context. For needs other than web, vectors and various formats have always been there and I think FontAwesome should not deviate from what it was originally intended for : providing common use icons for the everyday webdesigner.
That's why I think a lot of the the icons request made this far don't fit the bill ; if it's not part of a global and recurring need, even it may be added, I don't think it should get priority over icons intended for UI and ergonomy.

Recommend Projects

React

A declarative, efficient, and flexible JavaScript library for building user interfaces.
Vue.js

🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
Typescript

TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
TensorFlow

An Open Source Machine Learning Framework for Everyone
Django

The Web framework for perfectionists with deadlines.
Laravel

A PHP framework for web artisans
D3

Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

javascript

JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
web

Some thing interesting about web. New door for the world.
server

A server is a program made to process requests and deliver data to clients.
Machine learning

Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Visualization

Some thing interesting about visualization, use data art
Game

Some thing interesting about game, make everyone happy.

Recommend Org

Facebook

We are working to build community through open source technology. NB: members must have two-factor auth.
Microsoft

Open source projects and samples from Microsoft.
Google

Google ❤️ Open Source for everyone.
Alibaba

Alibaba Open Source for everyone
D3

Data-Driven Documents codes.
Tencent

China tencent open source team.

Jobs

Jooble