How to Add Emojis to a Vector Font

MicroVG supports the drawing of multicolor fonts that use the COLR/CPAL tables to define multi-layered glyphs. Multicolor fonts are mainly used for providing a set of colorful emojis in messaging applications. However, emojis fonts usually do not contain many characters other than emojis, which requires applications to use multiple fonts to handle all use cases.

One solution to minimize the number of fonts used by an application is to add emojis to another font (i.e., combine fonts into one). This article shows how to achieve this using FontLab, a third-party font editor.

Note

FontLab is not a free software (it has a 30-days trial period). Tests with other tools, including free solutions, were unsuccessful in this very specific task (e.g. FontTools, FontForge which are great tools for font editing).

Prerequisites

  • Windows 10 (and higher) or macOS 10.14 (and higher),

  • An COLR/CPAL emoji font (e.g., Segoe UI Emoji),

  • A target font (i.e., a TTF/OTF font to append emojis to).

Append the Emoji Glyphs

  1. Download and install FontLab.

  2. In FontLab, go to File > Export Profiles….

  3. Create a new Export Profile (the + button on the bottom-left).

  4. Edit the new profile to match the configuration below in menu Export color font files:

    New Export Profiles

  5. Click on OK to close the Export Profiles window.

  6. Open the emoji font: go to File > Open Fonts… and browse to the font file.

  7. Open the target font.

  8. Select a range of glyphs in the emoji font and select Edit > Copy Glyphs:

    Copy Emojis

  9. Select the target font and append the copied glyphs: go to Edit > Append Glyphs.

  10. Check that the glyphs have been added to the target font:

    Append Emojis

  11. To save the changes, go to File > Export Font As….

  12. In the Export Font dialog, select the new Export Profile (with COLR/CPAL support) and Destination.

    Export Font

  13. Click Export.

The exported font can then be used in an application, as described in the Application Developer Guide.

This procedure can also be used to add non-emoji glyphs to a font.

Warning

There are multiple ways of implementing emojis in fonts. The four main formats are COLR/CPAL (Microsoft), CBDT/CBLC (Google), SVG (Adobe/Firefox) and sbix (Apple). Each format uses custom tables in fonts to describe the emoji glyphs. MicroVG supports COLR/CPAL tables and this article only applies to this case. See this section for more details about color emojis support with MicroVG.