Neoseeker Icons

icon-glass
icon-music
icon-search
icon-envelope
icon-heart
icon-star
icon-star-empty
icon-user
icon-film
icon-th-large
icon-th
icon-th-list
icon-ok
icon-remove
icon-zoom-in
icon-zoom-out
icon-off
icon-signal
icon-cog
icon-trash
icon-home
icon-file-o
icon-clock-o
icon-road
icon-download-alt
icon-download
icon-upload
icon-inbox
icon-repeat
icon-refresh
icon-list-alt
icon-lock
icon-flag
icon-headphones
icon-volume-off
icon-volume-down
icon-volume-up
icon-qrcode
icon-barcode
icon-tag
icon-tags
icon-book
icon-bookmark
icon-print
icon-camera
icon-font
icon-bold
icon-italic
icon-align-left
icon-align-center
icon-align-right
icon-align-justify
icon-list
icon-dedent
icon-indent
icon-facetime-video
icon-picture
icon-pencil
icon-map-marker
icon-adjust
icon-tint
icon-edit
icon-share
icon-check
icon-move
icon-step-backward
icon-fast-backward
icon-backward
icon-play
icon-pause
icon-stop
icon-forward
icon-fast-forward
icon-step-forward
icon-eject
icon-chevron-left
icon-chevron-right
icon-plus-sign
icon-minus-sign
icon-remove-sign
icon-ok-sign
icon-question-sign
icon-info-sign
icon-screenshot
icon-remove-circle
icon-ok-circle
icon-ban-circle
icon-arrow-left
icon-arrow-right
icon-arrow-up
icon-arrow-down
icon-share-alt
icon-resize-full
icon-resize-small
icon-plus
icon-minus
icon-asterisk
icon-exclamation-sign
icon-gift
icon-leaf
icon-fire
icon-eye-open
icon-eye-close
icon-warning-sign
icon-plane
icon-calendar
icon-random
icon-comment
icon-magnet
icon-chevron-up
icon-chevron-down
icon-retweet
icon-shopping-cart
icon-folder
icon-folder-open
icon-resize-vertical
icon-resize-horizontal
icon-bar-chart-o
icon-key
icon-comments
icon-thumbs-o-up
icon-thumbs-o-down
icon-star-half
icon-heart-empty
icon-signout
icon-thumb-tack
icon-external-link
icon-signin
icon-trophy
icon-upload-alt
icon-phone
icon-square-o
icon-bookmark-o
icon-phone-square
icon-unlock
icon-rss
icon-hdd
icon-bullhorn
icon-bell
icon-certificate
icon-circle-arrow-left
icon-circle-arrow-right
icon-circle-arrow-up
icon-circle-arrow-down
icon-globe
icon-wrench
icon-tasks
icon-filter
icon-briefcase
icon-fullscreen
icon-group
icon-link
icon-cloud
icon-beaker
icon-cut
icon-copy
icon-paper-clip
icon-save
icon-bars
icon-list-ul
icon-list-ol
icon-strikethrough
icon-underline
icon-table
icon-magic
icon-truck
icon-caret-down
icon-caret-up
icon-caret-left
icon-caret-right
icon-columns
icon-sort
icon-sort-down
icon-sort-up
icon-envelope-alt
icon-undo
icon-legal
icon-dashboard
icon-comment-o
icon-comments-o
icon-bolt
icon-sitemap
icon-lightbulb-o
icon-exchange
icon-suitcase
icon-bell-o
icon-coffee
icon-file-text-o
icon-desktop
icon-laptop
icon-tablet
icon-mobile
icon-quote-left
icon-quote-right
icon-spinner
icon-reply
icon-expand-alt
icon-collapse-alt
icon-gamepad
icon-keyboard
icon-flag-alt
icon-code
icon-location-arrow
icon-crop
icon-code-fork
icon-unlink
icon-microphone
icon-microphone-off
icon-rocket
icon-chevron-sign-left
icon-chevron-sign-right
icon-chevron-sign-up
icon-chevron-sign-down
icon-unlock-alt
icon-bullseye
icon-ellipsis-horizontal
icon-ellipsis-vertical
icon-minus-square
icon-minus-square-o
icon-file-alt
icon-file-text
icon-sort-alpha-asc
icon-sort-alpha-desc
icon-sort-amount-asc
icon-sort-amount-desc
icon-sort-numeric-asc
icon-sort-numeric-desc
icon-thumbs-up
icon-thumbs-down
icon-archive
icon-bug
icon-plus-square
icon-play-circle
icon-text-width
icon-text-height
icon-folder-o
icon-folder-open-o
icon-flag-checkered
icon-clipboard

Examples

Colored Icons

icon-heart icon-white

icon-heart icon-inverse

To change the icon color, use the icon-white or icon-inverse for white icons, or any text-* classes from bootstrap. 


<p><i class="icon-heart icon-white"></i> icon-heart icon-white</p>
<p><i class="icon-heart icon-inverse"></i> icon-heart icon-inverse</p>
Bootstrap text-* classes might not apply until further fix.

Larger Icons

icon-camera

icon-camera

icon-camera

icon-camera

icon-camera

To increase icon sizes relative to their container, use the icon-lg (33% increase), icon-2x, icon-3x, icon-4x, or icon-5x classes. 


<p><i class="icon-camera icon-lg"></i> icon-camera</p>
<p><i class="icon-camera icon-2x"></i> icon-camera</p>
<p><i class="icon-camera icon-3x"></i> icon-camera</p>
<p><i class="icon-camera icon-4x"></i> icon-camera</p>
<p><i class="icon-camera icon-5x"></i> icon-camera</p>
If your icons are getting chopped off on top and bottom, make sure you have sufficient line-height.

Fixed Width Icons

Use icon-fw to set icons at a fixed width. Great to use when variable icon widths throw off alignment. Especially useful in things like nav lists. 


<ul class="nav nav-pills nav-stacked">
<li class="active"><a href="#"><i class="icon-home icon-fw"></i> Home</a></li>
<li><a href="#"><i class="icon-book icon-fw"></i> Library</a></li>
<li><a href="#"><i class="icon-pencil icon-fw"></i> Applications</a></li>
<li><a href="#"><i class="icon-cog icon-fw"></i> Settings</a></li>
</ul>

Bordered & Pulled Icons

Use a few styles together and you'll have easy pull quotes or a great introductory article icon.

Use icon-border and pull-right or pull-left for easy pull quotes or article graphics. 

<i class="icon-quote-left icon-2x pull-left icon-border"></i>
Use a few styles together and you'll have easy pull quotes or a great introductory article icon.

Spinning Icons

Use the icon-spin class to get any icon to rotate. Works well with icon-spinner, icon-refresh, and icon-cog. 

<i class="icon-spinner icon-spin"></i>
<i class="icon-refresh icon-spin"></i>
<i class="icon-cog icon-spin"></i>

CSS3 animations aren't supported in IE8 - IE9.

Rotated & Flipped

  normal
  icon-rotate-90
  icon-rotate-180
  icon-rotate-270
  icon-flip-horizontal
  icon-flip-vertical

To arbitrarily rotate and flip icons, use the icon-rotate-* and icon-flip-* classes. 

<i class="icon-rocket"></i>&nbsp; normal<br>
<i class="icon-rocket icon-rotate-90"></i>&nbsp; icon-rotate-90<br>
<i class="icon-rocket icon-rotate-180"></i>&nbsp; icon-rotate-180<br>
<i class="icon-rocket icon-rotate-270"></i>&nbsp; icon-rotate-270<br>
<i class="icon-rocket icon-flip-horizontal"></i>&nbsp; icon-flip-horizontal<br>
<i class="icon-rocket icon-flip-vertical"></i>&nbsp; icon-flip-vertical

Stacked Icons

icon-bug on icon-square-o
icon-flag on icon-certificate
icon-code on icon-stop
icon-ban-circle on icon-camera

To stack multiple icons, use the icon-stack class on the parent, the icon-stack-1x for the regularly sized icon, and icon-stack-2x for the larger icon. icon-inverse can be used as an alternative icon color. You can even throw larger icon classes on the parent to get further control of sizing. 

<span class="icon-stack icon-lg">
<i class="icon-square-o icon-stack-2x"></i>
<i class="icon-bug icon-stack-1x"></i>
</span>
icon-bug on icon-square-o<br>
<span class="icon-stack icon-lg">
<i class="icon-certificate icon-stack-2x"></i>
<i class="icon-flag icon-stack-1x icon-inverse"></i>
</span>
icon-flag on icon-certificate<br>
<span class="icon-stack icon-lg">
<i class="icon-stop icon-stack-2x"></i>
<i class="icon-code icon-stack-1x icon-inverse"></i>
</span>
icon-code on icon-stop<br>
<span class="icon-stack icon-lg">
<i class="icon-camera icon-stack-1x"></i>
<i class="icon-ban-circle icon-stack-2x text-danger"></i>
</span>
icon-ban-circle on icon-camera