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.
text on ico-london-tube
ico-launchpad
ico-safari
ico-eject
ico-apple
ico-coffee
ico-finder
<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.
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/525icons/3.5.0/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:
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>
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:
Rounded social icons:
Numbers:
Arrows:
Using css rotate classes as shown here:
<i class="ux ux-3x ico-arrow"></i>
<i class="ux ux-3x ico-arrow ux-rotate-180"></i>
<i class="ux ux-3x ico-arrow ux-rotate-90"></i>
<i class="ux ux-3x ico-arrow ux-rotate-270"></i>
(no class;.ux-rotate-45;.ux-rotate-90;.ux-rotate-135;.ux-rotate-180;
.ux-rotate-225;.ux-rotate-270;.ux-rotate-315)
Media player icons:
Use flip-horizontal class on 'forward', 'fast-forward' and 'step-forward':
<i class="ux ux-2x ico-fast-forward ux-flip-horizontal"></i>
Different ways of css styling: