Daftar Ikon Font Awesome dan CSS Value Contents

Daftar Ikon Font Awesome dan CSS Value Contents -  Saat ini saya akan memberikan Daftar Ikon Font Awesome beserta Value Contentnya. Font Awesome icon juga bisa disisipkan dengan pseudo elemen :before. Untuk cara penggunanya silahkan bisa anda baca di Cara Memasang Plugin Font Awesome di Blogger
font awesome icons

Untuk menambahkan icon Font Awesome pada pseudo elemen :before, tentunya anda 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"
Pada postingan ini hanya buat koleksi saya yang saya ambil dari blog kang ismet ,silahkan jika anda berminat memakainya. Semoga bermanfaat
Resource:http://blog.kangismet.net/2013/06/daftar-icon-font-awesome-lengkap-dan-css-content-value.html

23 Responses to Daftar Ikon Font Awesome dan CSS Value Contents

  1. banyak sekali ikon - ikonnya yaa mas,
    thanks mas informasinya :)

    ReplyDelete
    Replies
    1. iya mas baho,makasih kembali..:D

      Delete
    2. This comment has been removed by a blog administrator.

      Delete
  2. dengan font awesome ini juga akan mempercantik blog ya mas. sangat keren mas...

    ReplyDelete
  3. wah lengkap banget nih mas, trims sudah di sharing lagi...

    ReplyDelete
  4. Wah lengkap yah, terima kasih tutorialnya mas :)

    ReplyDelete
  5. wuihhh lengkap banget nih sob, keren deh :)

    ReplyDelete
  6. Mau tanya kang, itu bikin Loading blog menjadi berat gk yah kalo menggunakan Font Awesome ??

    ReplyDelete
    Replies
    1. sangat ringan kang,hehe dismaping tampilan lebih menarik loading blog sangat ringan :D

      Delete
  7. wah... banyak sekali bos, bagus2 lagi, hehehe...

    ReplyDelete
    Replies
    1. This comment has been removed by a blog administrator.

      Delete
  8. icon-nya komplit banget...tapi saya belum paham ikon itu untuk apa saja,,,,jadi nyimak saja dech.....keep happy blogging always...salam dari Makassar :-)

    ReplyDelete
    Replies
    1. iya sudah ada cara pengunaanya,lihat postingan berikutnya mas, salam kembali mas :D

      Delete
  9. This comment has been removed by a blog administrator.

    ReplyDelete

Note:
► Silahkan Berkomentar Sesuai Tema.✔
► No LINK. SPAM & PROMOSI ✘
► Segala Komentar Yang Masuk tidak Saya Moderasi ✔
► Dilarang Promosi (kecuali Ijin Admin ) ✔
► Link Hidup = Hapus.✔