Kang Rian [ on Blogger! ]

rian nurherdian, kang rian, blog kang rian, blog rian nurherdian, blogger hacks , free blogger templates, blogspot tutorial, blogger tutorial, tutorial seo, tutorial html5, blog seo friendly, modifikasi template blog, desain web pemula, blogger basic

Daftar Lengkap Icon Font Awesome CSS + Value

Daftar Lengkap Icon Font Awesome CSS + Value - Postingan Sebelumnya : Cara Pasang Icon Font Awesome di Blog

Daftar Lengkap Icon Font Awesome CSS + ValuePada postingan sebelumnya saya menjelaskan bagaimana cara pasang icon Font Awesome di Blog. Saat ini saya akan memberikan list lengkap icon Fon Awesome beserta Value Contentnya. Selain cara yang telah saya sebutkan sebelumnya, Font Awesome icon juga bisa disisipkan dengan pseudo elemen :before.

Untuk menambahkan icon Font Awesome pada pseudo elemen :before, tentunya sobat harus mengetahui value content dari icon tersebut. Contoh penggunaan :


.element {
    position: relative;
}
 
/*ganti conten value sesuai
dengan icon yang diperlukan*/
 
.element:before {
    content: "\f000"; 
    font-family: FontAwesome;
    font-style: normal;
    font-weight: normal;
    text-decoration: inherit;
/*--sesuaikan sebagai tambahan--*/
    color: #000;
    font-size: 18px;
    padding-right: 0.5em;
    position: absolute;
    top: 10px;
    left: 0;
}

Berikut ini list lengkap icon Font Awesome dan CSS value content

Icon Aplikasi Website

  • icon-adjust "\f042"
  • icon-anchor "\f13d"
  • icon-asterisk "\f069"
  • icon-ban-circle "\f05e"
  • icon-bar-chart "\f080"
  • icon-barcode "\f02a"
  • icon-beaker "\f0c3"
  • icon-beer "\f0fc"
  • icon-bell "\f0a2"
  • icon-bell-alt "\f0f3"
  • icon-bolt "\f0e7"
  • icon-book "\f02d"
  • icon-bookmark "\f02e"
  • icon-bookmark-empty "\f097"
  • icon-briefcase "\f0b1"
  • icon-bullhorn "\f0a1"
  • icon-bullseye "\f140"
  • icon-calendar "\f073"
  • icon-calendar-empty "\f133"
  • icon-camera "\f030"
  • icon-camera-retro "\f083"
  • icon-certificate "\f0a3"
  • icon-check-empty "\f096"
  • icon-check-minus "\f147"
  • icon-check-sign "\f14a"
  • icon-check "\f046"
  • icon-circle "\f111"
  • icon-circle-blank "\f10c"
  • icon-cloud "\f0c2"
  • icon-cloud-download "\f0ed"
  • icon-cloud-upload "\f0ee"
  • icon-code "\f121"
  • icon-code-fork "\f126"
  • icon-coffee "\f0f4"
  • icon-cog "\f013"
  • icon-cogs "\f085"
  • icon-collapse-alt "\f117"
  • icon-comment "\f075"
  • icon-comments "\f086"
  • icon-comments-alt "\f0e6"
  • icon-credit-card "\f09d"
  • icon-crop "\f125"
  • icon-dashboard "\f0e4"
  • icon-desktop "\f108"
  • icon-download "\f01a"
  • icon-download-alt "\f019"
  • icon-edit "\f044"
  • icon-edit-sign "\f14b"
  • icon-ellipsis-horizontal "\f141"
  • icon-ellipsis-vertical "\f142"
  • icon-envelope "\f003"
  • icon-envelope-alt "\f0e0"
  • icon-eraser "\f12d"
  • icon-exchange "\f0ec"
  • icon-exclamation "\f12a"
  • icon-exclamation-sign "\f06a"
  • icon-expand-alt "\f116"
  • icon-external-link "\f08e"
  • icon-external-link-sign "\f14c"
  • icon-eye-open "\f06e"
  • icon-eye-close "\f070"
  • icon-facetime-video "\f03d"
  • icon-fighter-jet "\f0fb"
  • icon-film "\f008"
  • icon-filter "\f0b0"
  • icon-fire-extinguisher "\f134"
  • icon-fire "\f06d"
  • icon-flag-alt "\f11d"
  • icon-flag-checkered "\f11e"
  • icon-folder-close "\f07b"
  • icon-folder-open "\f07c"
  • icon-folder-close-alt "\f114"
  • icon-folder-open-alt "\f115"
  • icon-food "\f0f5"
  • icon-frown "\f119"
  • icon-gamepad "\f11b"
  • icon-gift "\f06b"
  • icon-glass "\f000"
  • icon-globe "\f0ac"
  • icon-group "\f0c0"
  • icon-hdd "\f0a0"
  • icon-headphones "\f025"
  • icon-heart-empty "\f08a"
  • icon-heart "\f004"
  • icon-home "\f015"
  • icon-inbox "\f01c"
  • icon-info-sign "\f05a"
  • icon-info "\f129"
  • icon-key "\f084"
  • icon-keyboard "\f11c"
  • icon-laptop "\f109"
  • icon-leaf "\f06c"
  • icon-legal "\f0e3"
  • icon-lemon "\f094"
  • icon-level-up "\f148"
  • icon-level-down "\f149"
  • icon-lightbulb "\f0eb"
  • icon-location-arrow "\f124"
  • icon-lock "\f023"
  • icon-magic "\f0d0"
  • icon-magnet "\f076"
  • icon-mail-reply "\f112"
  • icon-mail-reply-all "\f122"
  • icon-mail-forward "\ff064"
  • icon-map-marker "\f041"
  • icon-meh "\f11a"
  • icon-microphone "\f130"
  • icon-microphone-off "\f131"
  • icon-minus "\f068"
  • icon-minus-sign "\f056"
  • icon-minus-sign-alt "\f146"
  • icon-mobile-phone "\f10b"
  • icon-money "\f0d6"
  • icon-move "\f047"
  • icon-music "\f001"
  • icon-off "\f011"
  • icon-ok "\f00c"
  • icon-ok-sign "\f058"
  • icon-ok-circle "\f05d"
  • icon-pencil "\f040"
  • icon-phone "\f095"
  • icon-phone-sign "\f098"
  • icon-picture "\f03e"
  • icon-plane "\f072"
  • icon-google-plus-sign "\f0d4"
  • icon-google-plus "\f0d5"
  • icon-print "\f02f"
  • icon-pushpin "\f08d"
  • icon-puzzle-piece "\f12e"
  • icon-qrcode "\f029"
  • icon-question-sign "\f059"
  • icon-question "\f128"
  • icon-quote-left "\f10d"
  • icon-quote-right "\f10e"
  • icon-random "\f074"
  • icon-refresh "\f021"
  • icon-remove-sign "\f057"
  • icon-remove-circle "\f05c"
  • icon-remove "\f00d"
  • icon-reorder "\f0c9"
  • icon-reply "\f112"
  • icon-reply-all "\f122"
  • icon-resize-vertical "\f07d"
  • icon-resize-horizontal "\f07e"
  • icon-retweet "\f079"
  • icon-road "\f018"
  • icon-rocket "\f135"
  • rotate-left "\f0e2"
  • rotate-right "\f01e"
  • icon-rss "\f09e"
  • icon-rss-sign "\f143"
  • icon-screenshot "\f05b"
  • icon-search "\f002"
  • icon-share "\f045"
  • icon-share-alt "\f064"
  • icon-share-sign "\f14d"
  • icon-shield "\f132"
  • icon-shopping-cart "\f07a"
  • icon-sign-blank "\f0c8"
  • icon-signal "\f012"
  • icon-signin "\f090"
  • icon-signout "\f08b"
  • icon-sitemap "\f0e8"
  • icon-smile "\f118"
  • icon-sort "\f0dc"
  • icon-sort-down "\f0dd"
  • icon-sort-up "\f0de"
  • icon-spinner "\f110"
  • icon-star "\f005"
  • icon-star-empty "\f006"
  • icon-star-half-full "\f123"
  • icon-star-half-empty "\f123"
  • icon-suitcase "\f0f2"
  • icon-tablet "\f10a"
  • icon-tag "\f02b"
  • icon-tags "\f02c"
  • icon-tasks "\f0ae"
  • icon-terminal "\f120"
  • icon-thumbs-up "\f087"
  • icon-thumbs-down "\f088"
  • icon-ticket "\f145"
  • icon-time "\f017"
  • icon-tint "\f043"
  • icon-trash "\f014"
  • icon-trophy "\f091"
  • icon-truck "\f0d1"
  • icon-umbrella "\f0e9"
  • icon-unlock "\f09c"
  • icon-unlock-alt "\f13e"
  • icon-upload "\f01b"
  • icon-upload-alt "\f093"
  • icon-user-md "\f0f0"
  • icon-user "\f007"
  • icon-volume-off "\f026"
  • icon-volume-down "\f027"
  • icon-volume-up "\f028"
  • icon-warning-sign "\f071"
  • icon-wrench "\f0ad"
  • icon-zoom-in "\f00e"
  • icon-zoom-out "\f010"

Icon Teks Editor

  • icon-file "\f016"
  • icon-file-alt "\f0f6"
  • icon-cut "\f0c4"
  • icon-copy "\f0c5"
  • icon-paste "\f0ea"
  • icon-save "\f0c7"
  • icon-undo "\f0e2"
  • icon-repeat "\f01e"
  • icon-text-height "\f034"
  • icon-text-width "\f035"
  • icon-align-left "\f036"
  • icon-align-center "\f037"
  • icon-align-right "\f038"
  • icon-align-justify "\f039"
  • icon-indent-left "\f03b"
  • icon-indent-right "\f03c"
  • icon-font "\f031"
  • icon-bold "\f032"
  • icon-italic "\f033"
  • icon-strikethrough "\f0cc"
  • icon-underline "\f0cd"
  • icon-superscript "\f12b"
  • icon-subscript "\f12c"
  • icon-link "\f0c1"
  • icon-unlink "\f127"
  • icon-paper-clip "\f0c6"
  • icon-eraser "\f12d"
  • icon-columns "\f0db"
  • icon-table "\f0ce"
  • icon-th "\f00a"
  • icon-th-list "\f00b"
  • icon-th-large "\f009"
  • icon-list "\f03a"
  • icon-list-ul "\f0ca"
  • icon-list-ol "\f0cb"
  • icon-list-alt "\f022"

Icon Penunjuk

  • icon-angle-left "\f104"
  • icon-angle-right "\f105"
  • icon-angle-up "\f106"
  • icon-angle-down "\f107"
  • icon-arrow-left "\f060"
  • icon-arrow-right "\f061"
  • icon-arrow-up "\f062"
  • icon-arrow-down "\f063"
  • icon-caret-down "\f0d7"
  • icon-caret-up "\f0d8"
  • icon-caret-left "\f0d9"
  • icon-caret-right "\f0da"
  • icon-chevron-left "\f053"
  • icon-chevron-right "\f054"
  • icon-chevron-up "\f077"
  • icon-chevron-down "\f078"
  • icon-chevron-sign-left "\f137"
  • icon-chevron-sign-right "\f138"
  • icon-chevron-sign-up "\f139"
  • icon-chevron-sign-down "\f13a"
  • icon-circle-arrow-left "\f0a8"
  • icon-circle-arrow-right "\f0a9"
  • icon-circle-arrow-up "\f0aa"
  • icon-circle-arrow-down "\f0ab"
  • icon-double-angle-left "\f100"
  • icon-double-angle-right "\f101"
  • icon-double-angle-up "\f102"
  • icon-double-angle-down "\f103"
  • icon-hand-right "\f0a4"
  • icon-hand-left "\f0a5"
  • icon-hand-up "\f0a6"
  • icon-hand-down "\f0a7"

Icon Video Player

  • icon-play "\f04b"
  • icon-play-sign "\f144"
  • icon-play-circle "\f01d"
  • icon-pause "\f04c"
  • icon-stop "\f04d"
  • icon-eject "\f052"
  • icon-forward "\f04e"
  • icon-fast-forward "\f050"
  • icon-step-backward "\f048"
  • icon-step-forward "\f051"
  • icon-fullscreen "\f0b2"
  • icon-resize-full "\f065"
  • icon-resize-small "\f066"

Icon Merk

  • icon-css3 "\f13c"
  • icon-facebook-sign "\f082"
  • icon-facebook "\f09a"
  • icon-twitter-sign "\f081"
  • icon-twitter "\f099"
  • icon-github "\f09b"
  • icon-github-sign "\f092"
  • icon-html5 "\f13b"
  • icon-linkedin "\f0e1"
  • icon-linkedin-sign "\f08c"
  • icon-maxcdn "\f136"
  • icon-pinterest "\f0d2"
  • icon-pinterest-sign "\f0d3"
  • icon-google-plus "\f0d5"
  • icon-google-plus-sign "\f0d4"

Icon Kedokteran

  • icon-ambulance "\f0f9"
  • icon-beaker "\f0c3"
  • icon-h-sign "\f0fd"
  • icon-hospital "\f0f8"
  • icon-medkit "\f0fa"
  • icon-plus-sign-alt "\f0fe"
  • icon-stethoscope "\f0f1"
  • icon-user-md "\f0f0"

Repost from : http://blog.kangismet.net/2013/06/daftar-icon-font-awesome-lengkap-dan-css-content-value.html

Resource : http://astronautweb.co/snippet/font-awesome/ - http://fortawesome.github.io/Font-Awesome/icons/
Suka artikel ini? Bagikan!