askdesign
5/26/2015 - 10:54 PM

Icons & Sprites

Sources and Resources

https://developer.wordpress.org/resource/dashicons/
https://glyphicons.com/ (halflings come with Bootstrap; regular was purchased in 2015)
https://fontawesome.io/
https://fontello.com/ - icon fonts generator

https://ionicons.com/ (Genesis WP themes: great list: see separate snippet for details)

https://icomoon.io/app/#/select
https://css-tricks.com/flat-icons-icon-fonts/ - great resource of flat icon font sources

https://www.iconsdb.com/
https://findicons.com/
https://findicons.com/icon/68360/wordpress
https://flaticons.net/
https://openclipart.org/
https://glyphsearch.com/
https://www.iconfinder.com/
https://www.flaticon.com/
https://adamwhitcroft.com/batch/
https://www.uiplayground.in/css3-icons/
https://thenounproject.com/
https://365psd.com/day/2-305/
https://kudakurage.com/ligature_symbols/
https://gemicon.net/
https://pictonic.co/free
https://modernuiicons.com/
https://typicons.com/
https://game-icons.net/
https://ionicons.com/ (Genesis WP themes: great list)
https://ionicons.com/v2/cheatsheet.html
<ion-icon name="email"></ion-icon> - this code doesn't work for me
<i class="ion-ios-email"></i>
<i class="icon ion-ios-email"></i>	
<i class="icon ion-email"></i>


The size of these icons can be changed with the font-size property in your Ionic CSS file.
.icon {
   font-size: 50px;
}
http://premium.wpmudev.org/blog/social-media-css-sprites/
http://www.w3schools.com/css/css_image_sprites.asp

/* --- Sprites --- */ - 11.9.10 (Joanne Meirovitz)
You also wanted me to send you this link. I haven’t checked it out yet:
http://spriteme.org/

* The easiest way to create resolution independent social icons.
http://perfecticons.com/
* Takes your SVG drawings and processes them to a CSS icon kit, coming in several different flavors. It prefers high-resolution (retina) SVG over PNG icons, data URIs over CSS sprites and single images and provides fallbacks for even the least capable browsers. It outputs Sass along with (or instead of) CSS code.

http://iconizr.com/
//To enable dashicons on your front-end, you’ll need to enqueue the dashicons stylesheet. 
//You can do this by adding a small snippet of code to your child theme’s functions.php file:

function load_dashicons_frontend() {
    wp_enqueue_style('dashicons');
}
add_action('wp_enqueue_scripts', 'load_dashicons_frontend');