Colour fonts and complex OpenType fonts

More than black outlines

Colour font technologies can store palettes, layered vector shapes, bitmap strikes or SVG artwork. The same file may look different—or fall back to monochrome—depending on the operating system, browser and application.

OpenType behaviour

Contextual substitutions, ligatures and stylistic sets can change glyphs according to neighbouring text. The specimen must shape complete text rather than render isolated characters if it is meant to demonstrate this behaviour accurately.

• COLR/CPAL colour layers
• SVG glyph artwork
• Variable axes
• Contextual alternates
• Stylistic sets and ligatures

Keep the catalogue fast

Trusted Free Fonts loads only a lightweight specimen in general lists. Full colour or highly complex rendering belongs on the individual font page; unusually heavy files open in the isolated Font Lab with an explicit loading notice.

Know which colour technology is inside

Colour fonts can use layered COLR/CPAL outlines, embedded SVG artwork or bitmap strikes. Support differs between operating systems, browsers, design applications and export formats. A font that looks correct in one preview may become monochrome, select the wrong palette or disappear in another workflow, so record the actual tables rather than using one generic colour-font label.

Bitmap colour fonts have resolution limits; SVG glyphs can contain detailed artwork; newer COLR versions can describe gradients and transforms. Those capabilities affect size, rendering cost and compatibility. Provide a monochrome or conventional fallback when the message must remain readable everywhere.

Test shaping and performance together

Complex OpenType features can replace glyphs according to language, neighbouring characters or user-selected stylistic sets. Test the shaping engine used by the real application and do not judge the file only from an unshaped glyph grid. Verify default text first, then ligatures, alternates, mark positioning and localised forms.

Measure file size, glyph complexity and rendering time on a typical phone as well as a desktop computer. Limit live previews to controlled samples, lazy-load expensive assets and avoid exposing a font that repeatedly stalls the page. Technical ambition is valuable only when the audience can still read and use the result.

• Identify COLR/CPAL, SVG or bitmap tables.
• Test browser, operating-system and export compatibility.
• Verify shaping features with real language samples.
• Provide a practical fallback and performance budget.