Friday, 27 June 2014

list of Font Awesome icons and their CSS content values


  • fa-glass “\f000″

  • fa-music “\f001″

  • fa-search “\f002″

  • fa-envelope-o “\f003″

  • fa-heart “\f004″

  • fa-star “\f005″

  • fa-star-o “\f006″

  • fa-user “\f007″

  • fa-film “\f008″

  • fa-th-large “\f009″

  • fa-th “\f00a”

  • fa-th-list “\f00b”

  • fa-check “\f00c”

  • fa-times “\f00d”

  • fa-search-plus “\f00e”

  • fa-search-minus “\f010″

  • fa-power-off “\f011″

  • fa-signal “\f012″

  • fa-cog “\f013″

  • fa-trash-o “\f014″

  • fa-home “\f015″

  • fa-file-o “\f016″

  • fa-clock-o “\f017″

  • fa-road “\f018″

  • fa-download “\f019″

  • fa-arrow-circle-o-down “\f01a”

  • fa-arrow-circle-o-up “\f01b”

  • fa-inbox “\f01c”

  • fa-play-circle-o “\f01d”

  • fa-repeat “\f01e”

  • fa-refresh “\f021″

  • fa-list-alt “\f022″

  • fa-lock “\f023″

  • fa-flag “\f024″

  • fa-headphones “\f025″

  • fa-volume-off “\f026″

  • fa-volume-down “\f027″

  • fa-volume-up “\f028″

  • fa-qrcode “\f029″

  • fa-barcode “\f02a”

  • fa-tag “\f02b”

  • fa-tags “\f02c”

  • fa-book “\f02d”

  • fa-bookmark “\f02e”

  • fa-print “\f02f”

  • fa-camera “\f030″

  • fa-font “\f031″

  • fa-bold “\f032″

  • fa-italic “\f033″

  • fa-text-height “\f034″

  • fa-text-width “\f035″

  • fa-align-left “\f036″

  • fa-align-center “\f037″

  • fa-align-right “\f038″

  • fa-align-justify “\f039″

  • fa-list “\f03a”

  • fa-outdent “\f03b”

  • fa-indent “\f03c”

  • fa-video-camera “\f03d”

  • fa-picture-o “\f03e”

  • fa-pencil “\f040″

  • fa-map-marker “\f041″

  • fa-adjust “\f042″

  • fa-tint “\f043″

  • fa-pencil-square-o “\f044″

  • fa-share-square-o “\f045″

  • fa-check-square-o “\f046″

  • fa-arrows “\f047″

  • fa-step-backward “\f048″

  • fa-fast-backward “\f049″

  • fa-backward “\f04a”

  • fa-play “\f04b”

  • fa-pause “\f04c”

  • fa-stop “\f04d”

  • fa-forward “\f04e”

  • fa-fast-forward “\f050″

  • fa-step-forward “\f051″

  • fa-eject “\f052″

  • fa-chevron-left “\f053″

  • fa-chevron-right “\f054″

  • fa-plus-circle “\f055″

  • fa-minus-circle “\f056″

  • fa-times-circle “\f057″

  • fa-check-circle “\f058″

  • fa-question-circle “\f059″

  • fa-info-circle “\f05a”

  • fa-crosshairs “\f05b”

  • fa-times-circle-o “\f05c”

  • fa-check-circle-o “\f05d”

  • fa-ban “\f05e”

  • fa-arrow-left “\f060″

  • fa-arrow-right “\f061″

  • fa-arrow-up “\f062″

  • fa-arrow-down “\f063″

  • fa-share “\f064″

  • fa-expand “\f065″

  • fa-compress “\f066″

  • fa-plus “\f067″

  • fa-minus “\f068″

  • fa-asterisk “\f069″

  • fa-exclamation-circle “\f06a”

  • fa-gift “\f06b”

  • fa-leaf “\f06c”

  • fa-fire “\f06d”

  • fa-eye “\f06e”

  • fa-eye-slash “\f070″

  • fa-exclamation-triangle “\f071″

  • fa-plane “\f072″

  • fa-calendar “\f073″

  • fa-random “\f074″

  • fa-comment “\f075″

  • fa-magnet “\f076″

  • fa-chevron-up “\f077″

  • fa-chevron-down “\f078″

  • fa-retweet “\f079″

  • fa-shopping-cart “\f07a”

  • fa-folder “\f07b”

  • fa-folder-open “\f07c”


Off-canvas mobile navigation tutorial


Off-canvas mobile navigation


Check out the tutorial about how to create a mobile navigation for a responsive website with a slide out CSS3 animation. Code snippets and Github repo.


 


  • fa-arrows-v “\f07d”

  • fa-arrows-h “\f07e”

  • fa-bar-chart-o “\f080″

  • fa-twitter-square “\f081″

  • fa-facebook-square “\f082″

  • fa-camera-retro “\f083″

  • fa-key “\f084″

  • fa-cogs “\f085″

  • fa-comments “\f086″

  • fa-thumbs-o-up “\f087″

  • fa-thumbs-o-down “\f088″

  • fa-star-half “\f089″

  • fa-heart-o “\f08a”

  • fa-sign-out “\f08b”

  • fa-linkedin-square “\f08c”

  • fa-thumb-tack “\f08d”

  • fa-external-link “\f08e”