I’m looking into the tutorials on how to create a color font and trying to test my COLR-font in different browsers.
After a lot of trial and error I finally got a working “proof of concept” character, but in any browser other than Firefox I get these .notdef glyphs showing up next to the character.
Any idea what might be causing this?
The .fcp file is here:
ColorFont.fcp (7.1 KB)
There are colour glyph conflicts because the members are not the same advance width. They should all be 1540 font units wide.
That is not the cause of the problem though. Adding glyph outlines to the empty glyphs seems to resolve the issue.
ColorFont.fcp (26.5 KB)
One technical requirement for COLR fonts is the fact they must implement glyph index 1 as the .null glyph.
See this tutorial:
https://www.high-logic.com/font-editor/fontcreator/tutorials/create-opentype-color-fonts
Thank you, now it seems to work.
I thought I had set the advance width correctly, I went to Tools → AutoMetrics → Fixed Width and then selected all the glyphs I wanted to set a fixed width for. Is there some other method I should use to set the advance width for all the relevant glyphs? It seems a bit difficult to work with if I’m going to create a proportionally spaced font or work with kerning.
Now I see what went wrong. I added a .null glyph, but for some reason I set the glyph index to 0, I think it might be because “null” is also the word for 0 in Norwegian.
Only the colour glyph members of a colour glyph need to be the same advance width. Other colour glyphs or monochrome glyphs can have a different width.