How to improve resolution when reducing font size

[AnastasiiaShta]

Hello
I faced a problem:
I save the photo in jpg format. When I use png the situation is much better, but as the font size decreases, the resolution still degrades a lot. I need to save it exactly in jpg format. Maybe you can help me with this.

Font size 20

Font size 10

Font size 5

var font = family.CreateFont(10, FontStyle.Regular); image.Mutate(x=>x.DrawText( text, font, new SolidBrush(Color.Black), new PointF(rectangle.X , rectangle.Y)));

I'm using version 1.0.0-beta19

[JimBobSquarePants]

What font are you using?
What is the size of the image?
What ate the dimensions of the rectangle?

All I can see here is some images which have been zoomed using software with a low quality resampler. There’s nothing to go with.

[AnastasiiaShta]

I used different fonts such as Arial, MicrosoftSansSerif, Calibri, Consola ttf/woff
I created a simple example:
` string text = @"some text";
var image = new Image(300, 200);

        FontCollection collection = new FontCollection();
        SixLabors.Fonts.FontFamily family = collection.Add("Arial.ttf");  

        var font1 = family.CreateFont(20, FontStyle.Regular);
        var font2 = family.CreateFont(10, FontStyle.Regular);
        var font3 = family.CreateFont(5, FontStyle.Regular);
        var rectangle = new SixLabors.ImageSharp.RectangleF
                        {
                            Height = 200,
                            Width = 300
                        };
       
        IBrush brush = new SixLabors.ImageSharp.Drawing.Processing.SolidBrush(Color.FromRgb(255, 255, 255));

       
        image.Mutate(x => x.Fill(brush, rectangle));

        image.Mutate(x=>x.DrawText(
                                   text, 
                                   font1, 
                                   new SixLabors.ImageSharp.Drawing.Processing.SolidBrush(Color.Black), 
                                   new SixLabors.ImageSharp.PointF(rectangle.X + 10, rectangle.Y + 10)));
        var textSize1 = TextMeasurer.MeasureBounds(text, new TextOptions(font1));
        image.Mutate(x => x.DrawText(
                                     text,
                                     font2,
                                     new SixLabors.ImageSharp.Drawing.Processing.SolidBrush(Color.Black),
                                     new SixLabors.ImageSharp.PointF(rectangle.X + 10, rectangle.Y + textSize1.Height+ 20)));
        var textSize2 = TextMeasurer.MeasureBounds(text, new TextOptions(font2));
        image.Mutate(x => x.DrawText(
                                     text,
                                     font3,
                                     new SixLabors.ImageSharp.Drawing.Processing.SolidBrush(Color.Black),
                                     new SixLabors.ImageSharp.PointF(rectangle.X + 10, rectangle.Y + textSize2.Height + textSize1.Height + 30)));
        
        image.Save(System.IO.Path.Combine("photoName.jpg"));`

This is the result of three different font sizes on one image:

Thank you for helping me)

[JimBobSquarePants]

When Windows renders old fonts like these the hunter contains lots of font specific hacks to make the output look good. We don’t use those hacks as they’re proprietary and we cannot determine what they are. You can try turning on hinting to see if that helps but at such small font sizes (5) these old fonts won’t render well.

[HellGate94]

still having no luck drawing pixel perfect / aligned fonts in Drawing v2.1.1 with Fonts 2.0.1

[JimBobSquarePants]

Can you share your code and your expected vs actual results

[HellGate94]

test of Microsoft Sans Serif with font size 16

Rendering Code:

DrawingOptions goptions = new() {
    GraphicsOptions = new() {
        Antialias = false,
        AntialiasSubpixelDepth = 0,
    }
};
Image<L8> img = new((int)maxSize.Width, (int)maxSize.Height);
img.Mutate((context) => {
    context.Clear(Color.Black);
    context.DrawText(goptions, str, font, Color.White, new(0, 0));
});

ImageSharp:

XXXXXXXXXXXXXXXXX
XXXXXXXXXXXXXXXXX
X  XXXXXXXXXXXXXX
X  XXXXXXXXXXXXXX
X  XXXXXXXXXXXXXX
X  X  XXXXXXXXXXX
X       XXXXXXXXX
X  XXXX XXXXXXXXX
X  XXXX XXXXXXXXX
X  XXXX XXXXXXXXX
X  XXXX XXXXXXXXX
X  XXXX XXXXXXXXX
X   XX  XXXXXXXXX
X  X   XXXXXXXXXX
XXXXXXXXXXXXXXXXX
XXXXXXXXXXXXXXXXX

XXXXXXXXXXXXXXXXX
XXXXXXXXXXXXXXXXX
XXXXXXX XXXXXXXXX
XXXXXX  XXXXXXXXX
XXXXXX  XXXXXXXXX
XXX     XXXXXXXXX
XX  X   XXXXXXXXX
X  XXX  XXXXXXXXX
X XXXX  XXXXXXXXX
X XXXX  XXXXXXXXX
X XXXX  XXXXXXXXX
X  XXX  XXXXXXXXX
X  XX   XXXXXXXXX
XX      XXXXXXXXX
XXXXXXXXXXXXXXXXX
XXXXXXXXXXXXXXXXX

versus System.Drawing using TextRenderingHint.SingleBitPerPixelGridFit

XXXXXXXXXXXXXXXX
XXXXXXXXXXXXXXXX
X  XXXXXXXXXXXXX
X  XXXXXXXXXXXXX
X  XXXXXXXXXXXXX
X      XXXXXXXXX
X   XX  XXXXXXXX
X  XXXX  XXXXXXX
X  XXXX  XXXXXXX
X  XXXX  XXXXXXX
X  XXXX  XXXXXXX
X  XXXX  XXXXXXX
X   XX  XXXXXXXX
X      XXXXXXXXX
XXXXXXXXXXXXXXXX
XXXXXXXXXXXXXXXX

XXXXXXXXXXXXXXXX
XXXXXXXXXXXXXXXX
XXXXXXX  XXXXXXX
XXXXXXX  XXXXXXX
XXXXXXX  XXXXXXX
XXX      XXXXXXX
XX  XX   XXXXXXX
X  XXXX  XXXXXXX
X  XXXX  XXXXXXX
X  XXXX  XXXXXXX
X  XXXX  XXXXXXX
X  XXXX  XXXXXXX
XX  XX   XXXXXXX
XXX      XXXXXXX
XXXXXXXXXXXXXXXX
XXXXXXXXXXXXXXXX

[JimBobSquarePants]

What about when you use hinting?

[HellGate94]

you mean RichTextOptions.HintingMode = HintingMode.Standard
because that makes it completely unreadable

XXXXXXXXXXXXXXXXX
XXXXXXXXXXXXXXXXX
XXXXXXXXXXXXXXXXX
XXXXXXXXXXXXXXXXX
XXXXXXXXXXXXXXXXX
XX XXXXXXXXXXXXXX
XXXXXXX XXXXXXXXX
XXXXXXX XXXXXXXXX
XXXXXXX XXXXXXXXX
XXXXXXX XXXXXXXXX
XXXXXXXXXXXXXXXXX
XX XXX XXXXXXXXXX
XXXXXXXXXXXXXXXXX
XXXXXXXXXXXXXXXXX
XXXXXXXXXXXXXXXXX

XXXXXXXXXXXXXXXXX
XXXXXXXXXXXXXXXXX
XXXXXXXXXXXXXXXXX
XXXXXXXXXXXXXXXXX
XXXXXXXXXXXXXXXXX
XXXXXXXXXXXXXXXXX
XXXXXXXXXXXXXXXXX
X XXXXXXXXXXXXXXX
X XXXXXXXXXXXXXXX
X XXXXXXXXXXXXXXX
X XXXXXXXXXXXXXXX
X XXXXXXXXXXXXXXX
XX XXX XXXXXXXXXX
XXXXXXXXXXXXXXXXX
XXXXXXXXXXXXXXXXX
XXXXXXXXXXXXXXXXX

[JimBobSquarePants]

Yeah. That doesn’t work then…. Must be a ton of hacks for the font with Windows rendering then.

I can’t compete with Microsoft there. They pulled together a team of the top people from around to work on their text rendering engine back in the day which was the basis for clear type. FreeType had a crack at it but ended up walking backwards from the attempt because it was too complicated.

[HellGate94]

too bad :/
but thanks for you help and work on the library!

[JimBobSquarePants]

It took a couple of years, but I actually got full hinting working.

https://sixlabors.com/posts/full-hinting-aligns-truetype-and-cff-glyphs-to-the-pixel-grid/