Can't change bold text color, a 'black bor

Question

When I change the color of the text I get the following result:

What is creating this black border?

This problem occurs when I'm generating a PDF using flying saucer, with an embedded font, and try to change the color on h1, h2, etc. If I dump the html flying saucer uses to generate the PDF to disk and open it in Chrome the color change is applied correctly, with no weird black border.

Answer 1

A font program contains all the path construction operators that are needed to draw a set of glyphs. When you use a glyph from a font, these drawing instructions are executed along with a path painting operator. By default, the path painting operator is a "fill" operator. No borders are drawn, the shape is just filled using the current fill color. This is called the default render mode.

Other rendermodes are for instance "stroke" which draws the outlines of the glyph using the current stroke color, but doesn't fill it. Or "fill and stroke" which draws the outlines using the default stroke color and fills the path using the default fill color. There's also a render mode "invisible" in which case nothing is stroked, nothing is filled.

Looking at your image, it seems like the render mode that is used fills the glyph in gray and strokes it using black (and the line width seems to be quite thick). If I had to guess, I'd say that you're trying to mimic "bold". The best way to draw text in bold, is to switch from a regular font (e.g. arial.ttf) to a bold font (e.g. arialbd.ttf). Unfortunately, not every font has a bold counterpart (e.g. there's arialuni.ttf, but no arialunibd.ttf). In that case, bold is mimicked by changing the render mode to "fill and stroke" and the line width is changed to give the glyphs a bold appearance. This could be what is happening in your case.

Check your HTML: are you by any chance talking about text that is in bold? If so, maybe you should change the font along with the color. That way, you'll use a true bold font instead of a pseudo false font.

DISCLAIMER: I don't know Flying Saucer and I don't want to know it. Flying Saucer is using iText for PDF generation. iText is a library I wrote, but Flying Saucer is using it without having established a business relationship with iText Group NV, which is a company I run. Hence it's the responsibility of the creators of Flying Saucer to support their software.