Icons
Font Awesome
Font Awesome is a pictographic language of web-related actions which delivers 220 icons. The Font Awesome webfont, CSS, and LESS files are licensed under CC BY 3.0 and you can find the full bs-examples of usage at Font Awesome - http://fortawesome.github.com/Font-Awesome
Add .icon-CLASS_NAME to any element, best used with a <span>.
Web Icons
icon-adjust
icon-asterisk
icon-ban-circle
icon-beaker
icon-bell
icon-bolt
icon-book
icon-bookmark
icon-bookmark-empty
icon-briefcase
icon-bullhorn
icon-calendar
icon-camera
icon-camera-retro
icon-certificate
icon-check
icon-check-empty
icon-cloud
icon-cog
icon-cogs
icon-comment
icon-comment-alt
icon-comments
icon-comments-alt
icon-credit-card
icon-dashboard
icon-download
icon-download-alt
icon-edit
icon-envelope
icon-envelope-alt
icon-asterisk
icon-ban-circle
icon-beaker
icon-bell
icon-bolt
icon-book
icon-bookmark
icon-bookmark-empty
icon-briefcase
icon-bullhorn
icon-calendar
icon-camera
icon-camera-retro
icon-certificate
icon-check
icon-check-empty
icon-cloud
icon-cog
icon-cogs
icon-comment
icon-comment-alt
icon-comments
icon-comments-alt
icon-credit-card
icon-dashboard
icon-download
icon-download-alt
icon-edit
icon-envelope
icon-envelope-alt
icon-exclamation-sign
icon-external-link
icon-eye-close
icon-eye-open
icon-facetime-video
icon-film
icon-filter
icon-fire
icon-flag
icon-folder-close
icon-folder-open
icon-gift
icon-glass
icon-globe
icon-group
icon-hdd
icon-headphones
icon-heart
icon-heart-empty
icon-home
icon-inbox
icon-info-sign
icon-key
icon-leaf
icon-legal
icon-lemon
icon-lock
icon-unlock
icon-magic
icon-magnet
icon-map-marker
icon-minus
icon-minus-sign
icon-external-link
icon-eye-close
icon-eye-open
icon-facetime-video
icon-film
icon-filter
icon-fire
icon-flag
icon-folder-close
icon-folder-open
icon-gift
icon-glass
icon-globe
icon-group
icon-hdd
icon-headphones
icon-heart
icon-heart-empty
icon-home
icon-inbox
icon-info-sign
icon-key
icon-leaf
icon-legal
icon-lemon
icon-lock
icon-unlock
icon-magic
icon-magnet
icon-map-marker
icon-minus
icon-minus-sign
icon-money
icon-move
icon-music
icon-off
icon-ok
icon-ok-circle
icon-ok-sign
icon-pencil
icon-picture
icon-plane
icon-plus
icon-plus-sign
icon-print
icon-pushpin
icon-qrcode
icon-question-sign
icon-random
icon-refresh
icon-remove
icon-remove-circle
icon-remove-sign
icon-reorder
icon-resize-horizontal
icon-resize-vertical
icon-retweet
icon-road
icon-rss
icon-screenshot
icon-search
icon-share
icon-shopping-cart
icon-move
icon-music
icon-off
icon-ok
icon-ok-circle
icon-ok-sign
icon-pencil
icon-picture
icon-plane
icon-plus
icon-plus-sign
icon-print
icon-pushpin
icon-qrcode
icon-question-sign
icon-random
icon-refresh
icon-remove
icon-remove-circle
icon-remove-sign
icon-reorder
icon-resize-horizontal
icon-resize-vertical
icon-retweet
icon-road
icon-rss
icon-screenshot
icon-search
icon-share
icon-shopping-cart
icon-signal
icon-signin
icon-signout
icon-sitemap
icon-sort
icon-sort-down
icon-sort-up
icon-star
icon-star-empty
icon-star-half
icon-tag
icon-tasks
icon-thumbs-down
icon-thumbs-up
icon-time
icon-tint
icon-trash
icon-trophy
icon-truck
icon-umbrella
icon-upload
icon-upload-alt
icon-user
icon-user-md
icon-volume-off
icon-volume-down
icon-volume-up
icon-warning-sign
icon-wrench
icon-zoom-in
icon-zoom-out
icon-signin
icon-signout
icon-sitemap
icon-sort
icon-sort-down
icon-sort-up
icon-star
icon-star-empty
icon-star-half
icon-tag
icon-tasks
icon-thumbs-down
icon-thumbs-up
icon-time
icon-tint
icon-trash
icon-trophy
icon-truck
icon-umbrella
icon-upload
icon-upload-alt
icon-user
icon-user-md
icon-volume-off
icon-volume-down
icon-volume-up
icon-warning-sign
icon-wrench
icon-zoom-in
icon-zoom-out
Text Editor Icons
icon-file
icon-cut
icon-copy
icon-paste
icon-save
icon-undo
icon-repeat
icon-paper-clip
icon-cut
icon-copy
icon-paste
icon-save
icon-undo
icon-repeat
icon-paper-clip
icon-text-height
icon-text-width
icon-align-left
icon-align-center
icon-align-right
icon-align-justify
icon-indent-left
icon-indent-right
icon-text-width
icon-align-left
icon-align-center
icon-align-right
icon-align-justify
icon-indent-left
icon-indent-right
icon-font
icon-bold
icon-italic
icon-strikethrough
icon-underline
icon-link
icon-columns
icon-table
icon-bold
icon-italic
icon-strikethrough
icon-underline
icon-link
icon-columns
icon-table
icon-th-large
icon-th
icon-th-list
icon-list
icon-list-ol
icon-list-ul
icon-list-alt
icon-th
icon-th-list
icon-list
icon-list-ol
icon-list-ul
icon-list-alt
Directional Icons
icon-arrow-down
icon-arrow-left
icon-arrow-right
icon-arrow-up
icon-chevron-down
icon-arrow-left
icon-arrow-right
icon-arrow-up
icon-chevron-down
icon-circle-arrow-down
icon-circle-arrow-left
icon-circle-arrow-right
icon-circle-arrow-up
icon-chevron-left
icon-circle-arrow-left
icon-circle-arrow-right
icon-circle-arrow-up
icon-chevron-left
icon-caret-down
icon-caret-left
icon-caret-right
icon-caret-up
icon-chevron-right
icon-caret-left
icon-caret-right
icon-caret-up
icon-chevron-right
icon-hand-down
icon-hand-left
icon-hand-right
icon-hand-up
icon-chevron-up
icon-hand-left
icon-hand-right
icon-hand-up
icon-chevron-up
Video Player Icons
icon-play-circle
icon-play
icon-pause
icon-stop
icon-play
icon-pause
icon-stop
icon-step-backward
icon-fast-backward
icon-backward
icon-forward
icon-fast-backward
icon-backward
icon-forward
icon-fast-forward
icon-step-forward
icon-eject
icon-step-forward
icon-eject
icon-fullscreen
icon-resize-full
icon-resize-small
icon-resize-full
icon-resize-small
Social Icons
icon-phone
icon-phone-sign
icon-facebook
icon-facebook-sign
icon-phone-sign
icon-facebook
icon-facebook-sign
icon-twitter
icon-twitter-sign
icon-github
icon-github-sign
icon-twitter-sign
icon-github
icon-github-sign
icon-linkedin
icon-linkedin-sign
icon-pinterest
icon-pinterest-sign
icon-linkedin-sign
icon-pinterest
icon-pinterest-sign
icon-google-plus
icon-google-plus-sign
icon-sign-blank
icon-google-plus-sign
icon-sign-blank
<span class="icon-CLASS_NAME"> ... </span> <span class="icon-download"> ... </span>
More Examples
Many examples re-used from the Twitter Bootstrap documentation.
Code
Inline Icon
Place Font Awesome icons just about anywhere with the <i> tag.
icon-camera-retro
<div style="font-size: 24px;">
<i class="icon-camera-retro"></i> icon-camera-retro
</div>
Icon classes are echoed via CSS :before.
Increase the icon size by using the icon-large class. This increases the size by 33% relative to the font-size of the container.
icon-camera-retro
<div style="font-size: 24px;">
<i class="icon-camera-retro icon-large"></i> icon-camera-retro
</div>