win81colorfont

Microsoft adds multi-color fonts in Windows 8.1, proposes OpenType standard

I’m a big fan of emojis, especially colored ones. At Microsoft BUILD 2013, the Windows graphics rendering team announced that Microsoft is proposing a practical and efficient addition to the OpenType font standard for multi-colored fonts support which they’ve implemented as a preview in Windows 8.1.

Existing multi-colored font alternatives use rendering font replacements or embedded bitmaps which are not very accurate or efficient. The proposal in a nutshell builds on top of the existing glyph to include multiple layers of glyphs and a RGBA color assigned to each layer.

This way it’s backwards compatible with existing operating systems as the fallback is the font’s glyph, or by user choice to disable colors.

win81-emoji

Windows 8.1 will ship with support for colored fonts enabled by default in XAML and HTML/JS apps. DirectX apps and games will have to opt-in to its rendering in code. A new dedicated emoji font, Segoe UI Emoji, uses the new color glyph layers. You can see them in the on-screen touch keyboard.

win81colorfont2

Microsoft also worked with some third-party font foundaries to prototype what colored versions of their fonts might look like. Of course these fonts aren’t going to start showing up in your office documents, but examples like colored dingbats are really interesting.

win81colorfont3

Besides just adding a splash of color to interesting fonts like emojis, there is also a practical side effect of allowing app designers and developers to utilise colored fonts as replacement for colored UI icon bitmaps because the font rendering system is extremely efficient and vector scalable for high-DPI displays.

The team hopes to submit the proposal to the ISO standards people for inclusion in the OpenType standard within weeks. I hope we’ll start to some interesting uses of color in fonts in the coming years.

24 insightful thoughts

  1. Cool idea, but honestly, Microsoft seems unable to make emoticons that focus on *emotion*. I’m not quite sure what ~30% of the faces in the screenshot are supposed to represent, or differentiate them from others. For the non-faces, about 60%. A face with a crown on it? Some wheat grains in front of a sun (and the blue one next to it–what is that???)? What on earth would I use those for? MSN Messenger’s emoticons were bad also, but even those were better than this.

    Yahoo Messenger–as little as I use it now–is still way, way, WAY ahead in this area. There’s no question what their emoticons mean, plus you get a written description of what they mean as you hover over each one–something that is missing in most (if not all) touch experiences.

    1. Ryan, the blue one you ask about is U+1F38F CARP STREAMER (aka koinobori), a sock traditionally flown on Children’s Day. The choice of symbols in Segoe UI Emoji come from the Unicode code charts – see the PDF on U+1F300 Miscellaneous Symbols and Pictographs for more details. The next version of Unicode will include even more emoji, notably more than the original 722 from DoCoMo, KDDI, and SoftBank.

    2. Ryan, these are not emoticons, they are emoji – a set of 722 symbols used by Japanese mobile phones, and recently standardized as part of Unicode. If you want to know what they all mean the Unicode standard has descriptions you can look up.

      Cheers, Si

  2. This is neat, but I’d rather Microsoft made an investment in a proper vector graphics format rather than trying to change the nature of fonts. Icon fonts make some sense for the web where SVG support might still leave a bit to be desired and the smaller size of font files is important, but Microsoft controls the entire pipeline for WinRT, so surely they can come up with a better solution.

  3. Fonts have been used for non-text elements since the early days of metal type – dingbats, borders and fleurons – in addition chromatic metal and wood fonts were used even earlier than that, so there’s nothing here that “changes” the nature of fonts.

    Cheers, Si

    1. A “proposal”, based on embedded bitmaps? Are you familiar with the concept of resolution independence? A wheel should be re-invented if the current “proposal” is for a square one. :-)

Leave a Reply