The Cartoonist's First Uninked Cel: On the Bleeding Edge of a Non-Vector Icon Font
In the golden age of animation, before digital renders and 3D modeling, the finality of a finished cel was everything. A lead animator’s fluid pencil drawings were handed off to an inker, who would carefully trace the lines onto a transparent acetate sheet, and then to a painter, who would fill the shapes from the back. The result was a crisp, vibrant character ready to be laid over a painted background. The process was meticulous, expensive, and absolute. There was no ‘undo.’
This precision finds a direct, if digital, descendant in the modern use of icon fonts. The promise was alluring: a single, small HTTP request could deliver hundreds of scalable, style-able glyphs through the magic of CSS. It was the animation studio’s dream of efficiency—a whole cast of characters, from simple arrows to complex social logos, all contained in one sleek, vector-based file.
But like a cel that has skipped the inking stage, the illusion is fragile. We’ve all seen it. A page loads, the text is there, but in place of the magnifying glass or the shopping cart icon, there is a blank rectangle. Or worse, a fallback system font character like a hollow box (▯) or a question mark () bleeds through momentarily before the custom font loads. The experience is jarring. It’s the equivalent of watching a beautiful animated sequence only to see the rough, uninked pencil sketches flash on screen for a half-second.
This is the core instability of the uninked cel. The icon font, for all its engineered efficiency, is a single point of failure. If the font file is blocked, slow to load, or fails to parse—a not uncommon occurrence with aggressive ad blockers or flaky networks—the entire visual language of those interactive elements simply vanishes. The user is left with a page that is not just visually broken, but functionally ambiguous. What does this empty box do? Is it even a button?
The modern move toward inline SVG is the digital equivalent of insisting on a proper ink pass. It’s a return to self-contained craftsmanship. Each icon is a complete, vector graphic entity. It can be styled with CSS, but it doesn’t rely on a remote, monolithic font file to exist. It renders with the rest of the HTML, it can be targeted individually for animation, and it doesn’t suffer from the occasional anti-aliasing quirks that plague font-based icons. Most importantly, it doesn’t bleed away, leaving a confusing void in its place.
The lesson from the animator’s cel is that some efficiencies are false if they compromise the integrity of the final product. True performance isn’t just about the number of HTTP requests; it’s about reliability, stability, and ensuring that the user’s experience remains whole and functional, from the first frame to the last. Inking the cel wasn’t an optional step; it was what made the art ready for the world. Our icons deserve the same definitive care.
Notes & further reading
A few pages I came back to while writing this: