525 icons

The web icon font with style





All trademarks, logos, and brands are property of their respective owners. The company, product and service names used in this website are for identification purposes only. Use of these names, logos, and brands does not indicate endorsement of the trademark holder by 525icons, nor vice versa.

Spinners


ico-spinner ux-spin

ico-circle-o-notch ux-spin

ico-spinner ux-pulse

ico-refresh ux-spin

ico-spinner3 ux-spin

ico-science ux-spin


Stacked icons


ico-lock on ico-circle-thinline

text on ico-calendar-open

ico-plus on ico-circle

Z

text on ico-char

50

text on ico-circle-o

ico-info on ico-square


 BLACKFRIARS

text on ico-london-tube

ico-pencil on ico-square

ico-snapchat on ico-square

ico-yin-yang on ico-frame

ico-cutlery on ico-square

ico-noentry on ico-camera


Stacked icons on ico-frame


Stacked icons - filetypes


ICO
TXT
CSS
PHP

Icons on metal-button bg:


ico-launchpad

ico-safari

ico-eject

ico-apple

ico-coffee

ico-finder


Shadows and borders


<i class="ux ico-quotes1 ux-4x ux pull-left border1 darkslategray"><i>
access icon, exchange icon, onenote icon, outlook icon, powerpoint icon, project icon, publisher icon, sharepoint icon, sway icon, word icon, excel icon, office icon, office365 icon, microsoft icon, visual-studio icon, docx icon, mp3 icon, wav icon, avi icon, mp4 icon, mov icon, png icon, psd icon, jpg icon, gif icon, ai icon, eps icon, pdf icon, sql icon, exe icon, css icon, js icon, php icon, html icon, asp icon, otf icon, zip icon, rar icon, svg icon, txt icon, battery-charging icon, stackoverflow icon, etsy icon, zurb icon, google analytics icon, foursquare icon, yelp icon, kik icon, color-cc icon, adobe-air icon, flashplayer icon, github icon, dribbble icon, pinterest icon, icq icon, flickr icon, scoopit icon, googleplus icon, addthis icon, yahoo icon, aim icon, picasa icon, share icon, tumblr icon, evernote icon, behance icon, linkedin icon, 500px icon, youtube icon, stumbleupon icon, delicious icon, facebook icon, twitter icon, instagram icon, vimeo icon, blogger icon.



<i class="ux ico-dice-six ux-4x radius12 ux pull-left shadow2 white bg-black"><i>
digg icon, pocket icon, vkontakte icon, email icon, align-left icon, align-center icon, align-right icon, align-justify icon, list icon, lock icon, keyboard icon, traffic-cone icon, bin icon, books icon, table icon, list-ol icon, list-ul icon, london-tube icon, map-marker icon, street-view icon, link icon, database icon, files icon, thumbs-up icon, stopwatch icon, spade icon, club icon,heart icon, diamond icon, key icon, yin-yang icon, radioactive icon, ce-mark icon, book icon, quotes icon, after-effects icon, illustrator icon, audition icon, bridge icon, dreamweaver icon, fireworks icon, indesign icon, lightroom icon, premiere icon, photoshop icon, eye icon, wifi icon, usb icon, usb-drive icon, bluetooth icon, calendar icon, calculator icon, newspaper icon, bing icon, marketplace icon, xbox icon, playstation icon, google web designer icon, hootsuite icon, stackexchange icon, meetup icon, mars icon, venus icon, peace icon, smiley icon, unhappy face icon, copyright icon, aries icon.



<i class="ux ico-dice-two ux-4x radius12 ux pull-left shadow2 white bg-black"><i>
taurus icon, gemini icon, cancer icon, leo icon, virgo icon, libra icon, scorpio icon, sagittarius icon, capricorn icon, aquarius icon, pisces icon, celcius icon, fahrenheit icon, pie chart icon,char icon, biohazard icon, slack icon, producthunt icon, jsdelivr icon, feedly icon, weebly icon, wechat icon, line icon, angularjs icon, maxcdn icon, angellist icon, recycle icon, snapchat icon, icloud icon, vine icon, coderwall icon, surveillancecam icon, mic icon, headphones icon, coffee icon, onedrive icon, creativecloud icon, sunny icon, partly-cloudy icon, cloudy icon, rainy icon, lightning icon, snowy icon, snowflake icon, send mail icon, go icon, notifications icon, select icon, app-launcher icon, globe icon,moon icon, stop-sign icon, movie-clapper icon, at icon, bullet icon, star icon, asterisk icon, archive-box icon, blueray icon, dvd icon, badge icon, target icon, palette icon, mouse icon, archive icon, lastfm icon,acrobat icon,google-play icon,amazon icon,scribd icon, science icon, library icon, suitcase icon, font awesome icon,registered icon, home icon,attachment icon.



<i class="ux ico-dice-five ux-4x radius12 ux pull-left black bg-white white-stroke2"><i>
cut icon, copy icon, paste icon, save icon, printer icon, visa icon, mastercard icon, paypal icon,creditcard icon, google wallet icon, start-chat icon, envelope icon, import icon, phone icon, radio icon, shoppingbag icon, shopping basket icon, question icon, info sign icon, caret icon, signal icon, fullscreen icon, expand icon, shrink icon, arrow-sign icon, chevron icon, arrow icon, angle icon, favorites icon, bookmark icon, terminal icon, remove icon, paintbrush icon, pencil icon, flipboard icon, eyedropper icon, edit icon, bucket icon, cc icon, by icon, css3 icon, html5 icon, wheelchair icon, water icon, train icon, swim icon, locker icon, alpine icon, guard icon, elevator icon, litter icon, bed icon, bus icon, plane icon, phone icon, parking icon, fuel icon, firstaid icon, fire-extinguisher icon, lighthouse icon, ladies icon, gents icon, infinity icon, recycle icon, search icon, refresh icon, rss icon, launchpad icon, film icon, noentry icon, attraction icon, cogs icon, construction icon.

All icons:

Click on any icon to copy the name (the 'ico-' prefix will be omitted).



ico-docs-com

ico-exchange

ico-onenote

ico-outlook

ico-powerpoint

ico-project

ico-publisher

ico-sharepoint

ico-sway

ico-word

ico-excel

ico-office

ico-office365

ico-microsoft

ico-visual-studio

ico-file-docx

ico-file-mp3

ico-file-wav

ico-file-avi

ico-file-mp4

ico-file-mov

ico-file-png

ico-file-psd

ico-file-jpg

ico-file-gif

ico-file-ai

ico-file-eps

ico-file-pdf

ico-file-sql

ico-file-exe

ico-file-css

ico-file-js

ico-file-php

ico-file-html

ico-file-asp

ico-file-otf

ico-file-zip

ico-file-rar

ico-file-svg

ico-file-txt

ico-battery-0

ico-battery-1

ico-battery-2

ico-battery-3

ico-battery-charging

ico-stackoverflow

ico-etsy

ico-zurb

ico-issuu

ico-foursquare

ico-yelp

ico-kik

ico-squarespace

ico-grav

ico-flashplayer

ico-github

ico-dribbble

ico-pinterest

ico-icq

ico-flickr

ico-scoopit

ico-addthis

ico-yahoo

ico-aim

ico-picasa

ico-tumblr

ico-evernote

ico-behance

ico-flipboard

ico-500px

ico-youtube

ico-stumbleupon

ico-delicious

ico-facebook

ico-twitter

ico-blogger

ico-digg

ico-vkontakte

ico-instagram

ico-volume-mute

ico-volume-down

ico-volume-up

ico-volume-off

ico-play

ico-pause

ico-stop

ico-forward

ico-fast-forward

ico-step-forward

ico-eject

ico-hd

ico-find-in-page

ico-g-translate

ico-circle-0

ico-circle-1

ico-circle-2

ico-circle-3

ico-circle-4

ico-circle-5

ico-circle-6

ico-circle-7

ico-circle-8

ico-circle-9

ico-lock

ico-lock-open

ico-calendar-open

ico-calendar

ico-gettyimages

ico-archive

ico-books

ico-table

ico-select-cells

ico-london-tube

ico-map-marker

ico-street-view

ico-link

ico-database

ico-thumbs-up

ico-circle-upload

ico-circle-download

ico-stopwatch

ico-card-spade

ico-card-club

ico-card-heart

ico-card-diamond

ico-key

ico-musicalnote

ico-yin-yang

ico-radioactive

ico-upload

ico-download

ico-ce-mark

ico-book

ico-quotes1

ico-exposure

ico-after-effects

ico-illustrator

ico-audition

ico-bridge

ico-dreamweaver

ico-fireworks

ico-indesign

ico-lightroom

ico-premiere

ico-photoshop

ico-connection-wifi

ico-wifi

ico-usb

ico-usb-drive

ico-bluetooth

ico-calculator

ico-newspaper

ico-bing

ico-marketplace

ico-xbox

ico-playstation

ico-google-wd

ico-hootsuite

ico-stackexchange

ico-gitlab

ico-glide

ico-wix

ico-meetup

ico-snapchat

ico-quotes2

ico-podcast

ico-producthunt

ico-slack

ico-files

ico-smiling-face

ico-smiling-eyes

ico-laughing-smiling-eyes

ico-winking-face

ico-smiling-heart-eyes

ico-kissing-face

ico-disappointed-face

ico-unamused-face

ico-persevering-face

ico-frowning-face

ico-unhappy-face

ico-aries

ico-taurus

ico-gemini

ico-cancer

ico-leo

ico-virgo

ico-libra

ico-scorpio

ico-sagittarius

ico-capricorn

ico-aquarius

ico-pisces

ico-celcius

ico-fahrenheit

ico-pie

ico-char

ico-biohazard

ico-jsdelivr

ico-feedly

ico-weebly

ico-wechat

ico-line

ico-angular

ico-maxcdn

ico-angellist

ico-recycle

ico-icloud

ico-phone-vol

ico-coderwall

ico-surveillance-cam

ico-mic

ico-headphones

ico-universal-access

ico-onedrive

ico-creativecloud

ico-sunny

ico-partly-cloudy

ico-cloudy

ico-rainy

ico-lightning

ico-snowy

ico-snowflake

ico-mail-send

ico-go

ico-notifications

ico-select

ico-app-launcher

ico-shapes

ico-globe

ico-moon

ico-stop-sign

ico-movie-clapper

ico-at

ico-square-bullet

ico-5star-shadow

ico-bullet

ico-deco-bullet

ico-square-bullet2

ico-asterisk

ico-star-e

ico-archive-box

ico-blueray

ico-dvd

ico-badge

ico-asterisk2

ico-star-small

ico-target

ico-palette

ico-mouse

ico-lastfm

ico-acrobat

ico-google-play

ico-amazon

ico-scribd

ico-science

ico-library

ico-suitcase

ico-fingerprint

ico-registered

ico-home

ico-home2

ico-attachment

ico-cut

ico-copy

ico-paste

ico-file-o

ico-save

ico-printer

ico-question

ico-creditcard

ico-cc-visa

ico-cc-mastercard

ico-cc-paypal

ico-g-wallet

ico-start-chat

ico-envelope-o

ico-envelope

ico-import

ico-phone

ico-radio

ico-keyboard

ico-imdb

ico-basket

ico-add-to-cart

ico-barcode

ico-info-circle

ico-info-circle2

ico-info

ico-toggle-on

ico-toggle-off

ico-signal-0

ico-signal-1

ico-signal-2

ico-signal-3

ico-signal-4

ico-signal-5

ico-favorites

ico-bookm-blk

ico-terminal

ico-sd-card

ico-fullscr

ico-fullscr-esc

ico-expand

ico-shrink

ico-circle-arrow

ico-circle-arrow-o

ico-circle-angle

ico-wp-arrow

ico-arrow-sign

ico-chevron

ico-chevron-circle

ico-arrow

ico-angle

ico-angle2

ico-angle-double

ico-caret

ico-caret-circle

ico-globe-2

ico-domain2

ico-sharing

ico-remove

ico-bin

ico-paintbrush

ico-pencil

ico-pencil2

ico-eyedropper

ico-edit

ico-cc

ico-by

ico-sa

ico-int-wheelchair

ico-int-water

ico-int-train

ico-int-swim

ico-int-locker

ico-int-alpine

ico-int-guard

ico-int-elevator

ico-int-litter

ico-int-bed

ico-int-bus

ico-int-plane

ico-int-phone

ico-int-p

ico-int-fuel

ico-int-firstaid

ico-fire-extinguisher

ico-int-ladies

ico-int-gents

ico-html5

ico-css3

ico-colours

ico-bucket

ico-infinity

ico-codeanywhere

ico-search

ico-spinner

ico-circle-o-notch

ico-refresh

ico-spinner3

ico-arrows

ico-rss

ico-launchpad

ico-film

ico-noentry

ico-attraction

ico-wp-cog-o

ico-wp-cog

ico-cogs

ico-construction

ico-clock

ico-qrcode

ico-ellipsis

ico-menu

ico-square-calc

ico-heart

ico-shut-down

ico-checkbox-checked

ico-dice-one

ico-dice-two

ico-dice-three

ico-dice-four

ico-dice-five

ico-dice-six

ico-go2

ico-circle-facebook

ico-circle-googleplus

ico-circle-instagram

ico-circle-mail

ico-circle-share

ico-circle-pinterest

ico-circle-linkedin

ico-circle-twitter

ico-circle-youtube

ico-chat

ico-comment

ico-comment-quote

ico-square-plus

ico-square-minus

ico-square-multi

ico-square-divide

ico-square-sum

ico-circleadd

ico-circle-minus

ico-circledelete

ico-circleselect

ico-cancel-circle

ico-select-circle

ico-cancel

ico-ok

ico-linkedin

ico-circle-github

ico-wordpress

ico-joomla

ico-jsfiddle

ico-google

ico-googleplus

ico-reddit

ico-pagelines

ico-weibo

ico-facebook2

ico-gmail

ico-codepen

ico-vlc

ico-jquery

ico-ms-edge

ico-chrome

ico-firefox

ico-ie

ico-opera

ico-safari

ico-user

ico-contacts

ico-group

ico-user-plus

ico-play-circle

ico-pause-circle

ico-stop-circle

ico-backward-circle

ico-forward-circle

ico-eject-circle

ico-camera-retro

ico-camera

ico-image-gallery

ico-image-gallery2

ico-image

ico-image-portrait

ico-w3schools

ico-msn

ico-messenger

ico-whatsapp

ico-viber

ico-itunes

ico-skype

ico-dropbox

ico-deviantart

ico-tripadvisor

ico-spotify

ico-google-drive

ico-hangouts

ico-tidal

ico-pocket

ico-youtube2

ico-myspace

ico-soundcloud

ico-recycle-o

ico-linux

ico-android

ico-vimeo

ico-windows8

ico-apple

ico-finder

ico-livestream

ico-bootstrap

ico-square

ico-circle

ico-circle-thinline

ico-circle-o

ico-warning-sign

ico-exclamation-circle

ico-desktop

ico-laptop

ico-tablet

ico-smartphone

ico-surface

ico-responsive

ico-coffee

ico-cutlery

ico-wine-bottle

ico-tvg

ico-cab

ico-bus

ico-train

ico-subway

ico-tram

ico-comment2

ico-frame

ico-notepad

ico-address-book

ico-vcard-o

ico-medkit

ico-disc

ico-sitemap

ico-zoom-in

ico-zoom-out

ico-green-dot

ico-bitnami

ico-path

ico-medium

ico-paypal

ico-mixcloud

ico-drupal8

ico-modx

ico-vivaldi

ico-qwant

ico-share

ico-share2

ico-sign-in

ico-sign-out

ico-plus

ico-alarm

ico-compass

ico-map

ico-map2

ico-eye

ico-heart-o

ico-venus

ico-mars

ico-file-ttf

ico-file-raw

ico-mail-send2

ico-marker

ico-traffic-cone

ico-wrench

ico-window-close

ico-square-phone

ico-telegram

ico-kakaotalk

ico-smartwatch

ico-logout

ico-walking

ico-cycling

ico-running

ico-swimming

ico-trekking

ico-family

ico-int-car-rental

ico-int-ship

ico-int-toilets

ico-int-departure

ico-up-left

ico-up-left-arrow

ico-arrow2

ico-departing-flight

ico-arriving-flight

ico-misc-waste

ico-plastic-waste

ico-paper-waste

ico-food-waste

ico-metal-glass-waste

ico-stats

ico-el-hazard

ico-umbrella

ico-chat2

ico-blog

ico-app-store

ico-twitch

ico-cssdeck

ico-envato

ico-typo3

ico-jquery-ui

ico-blocs

ico-phonegap

ico-brackets

ico-code

ico-sass

ico-less

ico-php

ico-atom

ico-react

ico-int-lighthouse

ico-int-bicycle

ico-int-heliport

ico-int-tram

ico-int-exit

View image sprite 48px sizes:



How to use the font in your site:

The 525icons css and font files are available at
jsdelivr.com
The free super-fast CDN for developers and webmasters.

You do not need to add the font files on your own server. It's sufficient to link the css file like this:

<link rel="stylesheet" type='text/css' href="https://cdn.jsdelivr.net/gh/runestro/525icons@v4.0/fonts/525icons.min.css">
This line must be inside the <head> of your html.

If you want to place the font files on your own server, make sure the entire fonts directory from the zip-file '525icons.zip' is copied into your project. You will need the files:

  • fonts/525icons.css
  • fonts/525icons.eot
  • fonts/525icons.svg
  • fonts/525icons.ttf
  • fonts/525icons.woff
  • fonts/525icons.woff2

The css file must be in the same directory as the fonts. If not, you have to make changes in the code.
In the <head> of your html, reference the location to your 525icons.css and fonts.
<link rel="stylesheet" type='text/css' href="path/to/fonts/525icons.css">

You do not need the file 525icons.otf, unless you want to install it on your OS.

How to place the icons in your html-file:

If you are familiar with the use of the Font Awesome web font, the 525icons css code has some differences. Like Font Awesome, 525icons is designed to be used with the inline element: <i>.
The icons are placed by adding the CSS prefix 'ux' plus the 'ico-' class prefix in front of the icons name, like in this example:

<i class="ux ico-yin-yang"></i>

And you may add additional classes, like here:
<i class="ux ico-yin-yang ux-2x black bg-orange img-circle"></i>

Accessibility

If you use an icon just to add some extra decoration or branding,
it does not need to be announced to users who are navigating your site aurally.
In that case, you should use the string: aria-hidden="true", like in this example:

<i class="ux ico-asterisk ux-2x" aria-hidden="true"></i>

If an icon conveys meaning in your content or interface,
ensure that this meaning is also conveyed to assistive technologies through alternative text, like in the use of the aria-label string, shown here:

<a href="#top" aria-label="Go to top">
<i class="ux ico-angle-double ux-rotate-90 ux-2x black" aria-hidden="true"></i>
</a>


525icons font as a dingbat font

  To use the 525icons OTF font in desktop applications, you have to install the font on your system. When installing the font or viewing it, the operating system may not show all the glyphs in the font. In most cases only the basic Latin characters are shown.
Here you can see a screenshot of the font in use in Adobe Illustrator: