Join James Williamson for an in-depth discussion in this video Structuring multicolored glyphs, part of Deploying Icon Fonts for the Web.
…One of the chief complaints that some designers,…have about icon fonts is that unlike ping…files and jif files and ASVG's and things…like that icon fonts are typically just monochromatic.…This is a specimen sheet that I've created, for the…font that we've been using throughout the course called Chunky Mobile.…This is an icon font I built specifically for this course.…I'm going to be refining it shortly after that…and then open sourcing it for the web.…So, you guys are getting sort of an early version of it.…
That you can take home with you, because it will be part of the exercise files.…Part of the resource files at the end of the course.…Alright.…As I scroll down through here, though.…You can see in this specimen, that all of these icons are a single color.…In this case, black.…But I certainly could have made them any color that I want.…But if I scroll all the way down to the bottom, however.…Aha!…We have multi colored icons.…So a lot of icon font sets out there will have multi…colored icons, and that might prompt you to wonder, well wait a second.…
Want to create your own icon fonts? Check out James' companion course, Creating Icon Fonts for the Web.
- Finding icon fonts
- Ensuring consistent styling
- Exploring class-based solutions for deployment
- Deploying with the data-icon attribute
- Aligning icons
- Animating icons
- Styling multicolored glyphs