<span itemprop="name">Elusive-Icons Webfont</span>

Elusive-Icons Webfont

299 Sleek vector icons for bootstrap.

Elusive Icons is a webfont that can be used with any of your projects. Bootstrap-based, Foundation-based or even your custom projects!

It was created by the need for an Open-Source font that can be used in your projects without licencing issues and/or other “attribution” claws.

When downloading this font you’ll also receive all the icons in .svg vector format so you can play with them, improve them and contribute them back on github.



el-icon-zoom-out
el-icon-zoom-in
el-icon-youtube
el-icon-wrench-alt
el-icon-wrench
el-icon-wordpress
el-icon-wheelchair
el-icon-website-alt
el-icon-website
el-icon-warning-sign
el-icon-w3c
el-icon-volume-up
el-icon-volume-off
el-icon-volume-down
el-icon-vkontakte
el-icon-vimeo
el-icon-view-mode
el-icon-video-chat
el-icon-video-alt
el-icon-video
el-icon-viadeo
el-icon-user
el-icon-usd
el-icon-upload
el-icon-unlock-alt
el-icon-unlock
el-icon-universal-access
el-icon-twitter
el-icon-tumblr
el-icon-trash-alt
el-icon-trash
el-icon-torso
el-icon-tint
el-icon-time-alt
el-icon-time
el-icon-thumbs-up
el-icon-thumbs-down
el-icon-th-list
el-icon-th-large
el-icon-th
el-icon-text-width
el-icon-text-height
el-icon-tasks
el-icon-tags
el-icon-tag
el-icon-stumbleupon
el-icon-stop-alt
el-icon-stop
el-icon-step-forward
el-icon-step-backward
el-icon-star-empty
el-icon-star-alt
el-icon-star
el-icon-stackoverflow
el-icon-spotify
el-icon-speaker
el-icon-soundcloud
el-icon-smiley-alt
el-icon-smiley
el-icon-slideshare
el-icon-skype
el-icon-signal
el-icon-shopping-cart-sign
el-icon-shopping-cart
el-icon-share-alt
el-icon-share
el-icon-search-alt
el-icon-search
el-icon-screenshot
el-icon-screen-alt
el-icon-screen
el-icon-scissors
el-icon-rss
el-icon-road
el-icon-reverse-alt
el-icon-retweet
el-icon-return-key
el-icon-resize-vertical
el-icon-resize-small
el-icon-resize-horizontal
el-icon-resize-full
el-icon-repeat-alt
el-icon-repeat
el-icon-remove-sign
el-icon-remove-circle
el-icon-remove
el-icon-refresh
el-icon-reddit
el-icon-record
el-icon-random
el-icon-quotes-alt
el-icon-quotes
el-icon-question-sign
el-icon-question
el-icon-qrcode
el-icon-puzzle
el-icon-print
el-icon-podcast
el-icon-plus-sign
el-icon-plus
el-icon-play-circle
el-icon-play-alt
el-icon-play
el-icon-plane
el-icon-pinterest
el-icon-picture
el-icon-picasa
el-icon-photo-alt
el-icon-photo
el-icon-phone-alt
el-icon-phone
el-icon-person
el-icon-pencil-alt
el-icon-pencil
el-icon-pause-alt
el-icon-pause
el-icon-path
el-icon-paper-clip-alt
el-icon-paper-clip
el-icon-opensource
el-icon-ok-sign
el-icon-ok-circle
el-icon-ok
el-icon-off
el-icon-network
el-icon-myspace
el-icon-music
el-icon-move
el-icon-minus-sign
el-icon-minus
el-icon-mic-alt
el-icon-mic
el-icon-map-marker-alt
el-icon-map-marker
el-icon-male
el-icon-magnet
el-icon-magic
el-icon-lock-alt
el-icon-lock
el-icon-livejournal
el-icon-list-alt
el-icon-list
el-icon-linkedin
el-icon-link
el-icon-lines
el-icon-leaf
el-icon-lastfm
el-icon-laptop-alt
el-icon-laptop
el-icon-key
el-icon-italic
el-icon-iphone-home
el-icon-instagram
el-icon-info-sign
el-icon-indent-right
el-icon-indent-left
el-icon-inbox-box
el-icon-inbox-alt
el-icon-inbox
el-icon-idea-alt
el-icon-idea
el-icon-hourglass
el-icon-home-alt
el-icon-home
el-icon-heart-empty
el-icon-heart-alt
el-icon-heart
el-icon-hearing-impaired
el-icon-headphones
el-icon-hdd
el-icon-hand-up
el-icon-hand-right
el-icon-hand-left
el-icon-hand-down
el-icon-guidedog
el-icon-group-alt
el-icon-group
el-icon-graph-alt
el-icon-graph
el-icon-googleplus
el-icon-globe-alt
el-icon-globe
el-icon-glasses
el-icon-glass
el-icon-github-text
el-icon-github
el-icon-gift
el-icon-gbp
el-icon-fullscreen
el-icon-friendfeed-rect
el-icon-friendfeed
el-icon-foursquare
el-icon-forward-alt
el-icon-forward
el-icon-fork
el-icon-fontsize
el-icon-font
el-icon-folder-sign
el-icon-folder-open
el-icon-folder-close
el-icon-folder
el-icon-flickr
el-icon-flag-alt
el-icon-flag
el-icon-fire
el-icon-filter
el-icon-film
el-icon-file-new-alt
el-icon-file-new
el-icon-file-edit-alt
el-icon-file-edit
el-icon-file-alt
el-icon-file
el-icon-female
el-icon-fast-forward
el-icon-fast-backward
el-icon-facetime-video
el-icon-facebook
el-icon-eye-open
el-icon-eye-close
el-icon-exclamation-sign
el-icon-eur
el-icon-error-alt
el-icon-error
el-icon-envelope-alt
el-icon-envelope
el-icon-eject
el-icon-edit
el-icon-dribbble
el-icon-download-alt
el-icon-download
el-icon-digg
el-icon-deviantart
el-icon-delicious
el-icon-dashboard
el-icon-css
el-icon-credit-card
el-icon-compass-alt
el-icon-compass
el-icon-comment-alt
el-icon-comment
el-icon-cogs
el-icon-cog-alt
el-icon-cog
el-icon-cloud-alt
el-icon-cloud
el-icon-circle-arrow-up
el-icon-circle-arrow-right
el-icon-circle-arrow-left
el-icon-circle-arrow-down
el-icon-child
el-icon-chevron-up
el-icon-chevron-right
el-icon-chevron-left
el-icon-chevron-down
el-icon-check-empty
el-icon-check
el-icon-certificate
el-icon-cc
el-icon-caret-up
el-icon-caret-right
el-icon-caret-left
el-icon-caret-down
el-icon-car
el-icon-camera
el-icon-calendar-sign
el-icon-calendar
el-icon-bullhorn
el-icon-bulb
el-icon-brush
el-icon-broom
el-icon-briefcase
el-icon-braille
el-icon-bookmark-empty
el-icon-bookmark
el-icon-book
el-icon-bold
el-icon-blogger
el-icon-blind
el-icon-bell
el-icon-behance
el-icon-barcode
el-icon-ban-circle
el-icon-backward
el-icon-asl
el-icon-arrow-up
el-icon-arrow-right
el-icon-arrow-left
el-icon-arrow-down
el-icon-align-right
el-icon-align-left
el-icon-align-justify
el-icon-align-center
el-icon-adult
el-icon-adjust-alt
el-icon-adjust
el-icon-address-book-alt
el-icon-address-book
el-icon-asterisk

Integration

You can use the Elusive icons font with bootstrap:

Bootstrap using LESS

Use this method if integrating with Twitter Bootstrap using LESS

  1. Copy the elusive-iconfont directory into your project.
  2. Copy elusive-webfont.less into your bootstrap/less directory.
  3. Open bootstrap.less and replace @import "sprites.less"; with @import "elusive-webfont.less";
  4. Open your project’s elusive-webfont.less and edit the font url to ensure it points to the right place.
    @font-face {
      font-family: 'Elusive-Icons';
      src:url('../font/Elusive-Icons.eot');
      src:url('../font/Elusive-Icons.eot?#iefix') format('embedded-opentype'),
        url('../font/Elusive-Icons.svg#Elusive-Icons') format('svg'),
        url('../font/Elusive-Icons.woff') format('woff'),
        url('../font/Elusive-Icons.ttf') format('truetype');
      font-weight: normal;
      font-style: normal;
    }
  5. Re-compile your LESS if using a static compiler.
  6. You should be good to go!

Bootstrap using CSS

Use this method if integrating with Twitter Bootstrap using CSS.

  1. Customize Twitter Bootstrap here. Make sure to uncheck the default “Icons” under “Base CSS.”
  2. Copy the Elusive Icons font directory into your project.
  3. Copy elusive-webfont.css into your project.
  4. Open your project’s elusive-webfont.css and edit the font url to ensure it points to the right place (see above example).
  5. In the <head> of your html, reference the location to your elusive-webfont.css.
    <link rel="stylesheet" href="../css/bootstrap.css">
    <link rel="stylesheet" href="../css/elusive-webfont.css">

Not using Bootstrap?

Elusive Icons works just as well without Twitter Bootstrap.

  1. Copy the Elusive Icons directory into your project.
  2. Copy elusive-webfont.less or elusive-webfont.css into your project.
  3. Open your project’s elusive-webfont.less or elusive-webfont.css and edit the font url to ensure it points to the right place (see above example).

  • Joshua Tenner

    Wonderful product. Had more problems with IIS than I had with including the icons in my project.

    Thanks for your hard work!

  • herni chinaski

    Thank you very much!!

    easy to install, great result

  • Paulo Mendez

    thanks a lot!!

  • Mateus Neves

    This is awesome!!! Tanks!!!

  • myles

    Why is the SVG file empty? There are no vectors when I open it in Illustrator.

    • aristath

      SVG font files don’t simply open using illustrator.
      You can get the SVGs for individual icons though inside the dev/icons-svg folder.
      These can be opened with illustrator.

    • aristath

      SVG font files don’t simply open using illustrator.
      You can get the SVGs for individual icons though inside the dev/icons-svg folder.
      These can be opened with illustrator.

  • Shane Permalloo

    Is there a Cheatsheets to get all the unicode of these icons ?

    • Ermanno Debenedetti

      +1.
      Being able to use the icons in Photoshop would be great!

      • Helder Faria

        I have the same opinion. Is there any way to use it in Photoshop?

  • Wajid

    icon not working in Mozilla (i am using version 24) Please help me

    • aristath

      Hello there!

      Sorry for the long wait… Could you please try that again? I believe we fixed that a week ago, I just forgot to reply.

      • Wajid Ali

        thanks a lot!!

        • Adam Robins

          I always find it amusing people get something for free and then request more.

          • http://www.deepbass.com/portfolio Brad Shaw

            So does that mean he’s not allowed to put in a request an important icon that’s missing from this set? That’s pretty stupid, given that it’s a pretty standard practice for all of these open source icon sets.

      • Wajid Ali

        Plz add icon mobile phone

    • aristath

      I think this has already been fixed, can you please try it again?

  • http://varemenos.com/ Adonis K. (Varemenos)

    Φοβερός!

    • aristath

      Ευχαριστώ!

  • http://blog.jbruni.com.br/ J. Bruni

    I can’t find an “email” or “message” icon with an “envelope” drawing. I’ve scrolled up and down, quick and slow… what is the icon name? Is it really missing? I can’t believe. These icons are fantastic. Thanks a lot.

    • http://wordpress-style.net/ Eduard Ungureanu

      this is the icon: el-icon-envelope use your browser search for envelope. Simple as that.

  • http://wordpress-style.net/ Eduard Ungureanu

    Great Job Thank you for your hard work. Bookmark this page. Cheers.

  • webapptester

    Just one word: Congats!!!!!!

  • Kevin

    Tried to download the Elusive-Icons Webfont’s but something seems wrong with the .zip file. After downloading I tried to open the .zip file but tells me that the .zip file might be damaged. Others had these issues?