Need help with monosocialiconsfont?
Click the “chat” button below for chat support from the developer who created it, or find similar developers for support.
drinchev

Description

Mono Social Icons Font

417 Stars 57 Forks SIL Open Font License 1.1 7 Commits 42 Opened issues

Services available

Need anything else?

Mono Social Icons Font

Mono Social Icons Font is a webfont based on Mono Social Icons, which includes ~100 social icons in three variations under one font : circled, rounded and regular.

Demo & dowmload links : http://drinchev.github.io/monosocialiconsfont

How to use

This font comes with included liga feature for letter substitution of your icons. You can also use the unicode method for referring to the unicode places in the font table.

HTML

Twitter symbol : circletwitterbird

Twitter symbol with unicode : 

Follow us

Unicode : Follow us

CSS

@font-face {
    font-family: 'Mono Social Icons Font';
    src: url('MonoSocialIconsFont-1.10.eot');
    src: url('MonoSocialIconsFont-1.10.eot?#iefix') format('embedded-opentype'),
         url('MonoSocialIconsFont-1.10.woff') format('woff'),
         url('MonoSocialIconsFont-1.10.ttf') format('truetype'),
         url('MonoSocialIconsFont-1.10.svg#MonoSocialIconsFont') format('svg');
    src: url('MonoSocialIconsFont-1.10.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

.symbol, a.symbol:before { font-family: 'Mono Social Icons Font'; -webkit-text-rendering: optimizeLegibility; -moz-text-rendering: optimizeLegibility; -ms-text-rendering: optimizeLegibility; -o-text-rendering: optimizeLegibility; text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; -moz-font-smoothing: antialiased; -ms-font-smoothing: antialiased; -o-font-smoothing: antialiased; font-smoothing: antialiased; }

a.symbol:before { content: attr(title); margin-right: 0.3em; font-size: 130%; }

Or if you work with Compass, then you can use

@include font-face("Mono Social Icons Font", font-files("MonoSocialIconsFont-1.10.woff", "MonoSocialIconsFont-1.10.ttf", "MonoSocialIconsFont-1.10.svg#MonoSocialIconsFont"), "MonoSocialIconsFont-1.10.eot", normal, normal);

.symbol, a.symbol:before { font-family: 'Mono Social Icons Font'; -webkit-text-rendering: optimizeLegibility; -moz-text-rendering: optimizeLegibility; -ms-text-rendering: optimizeLegibility; -o-text-rendering: optimizeLegibility; text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; -moz-font-smoothing: antialiased; -ms-font-smoothing: antialiased; -o-font-smoothing: antialiased; font-smoothing: antialiased; }

a.symbol:before { content: attr(title); margin-right: 0.3em; font-size: 130%; }

Changelog

Version 1.10 ( 21 May 2013 )

  • updated twitter bird icon
  • added instagram icon
  • minor fixes of some ligatures

Special Thanks

This font is based on Mono Social Icons by IconDock and Double-J Design. It adds two more icons to the set : Google Plus and GitHub Alternative Icon

License

It's free for whatever use ( commercial or personal ), both for web or for printing purpose. Licensed under the Open Font License.

We use cookies. If you continue to browse the site, you agree to the use of cookies. For more information on our use of cookies please see our Privacy Policy.