# How to make font rendering lighter?

**URL:** <https://forum.juce.com/t/how-to-make-font-rendering-lighter/25086>\
**Category:** General JUCE discussion\
**Created:** [November 10, 2017, 12:00pm UTC](https://forum.juce.com/t/how-to-make-font-rendering-lighter/25086 "2017-11-10T12:00:15Z")\
**Posts on this page:** 20\
**Page:** 1

<div class="post-metadata">

**Author:** ![jamiebullock](https://sea2.discourse-cdn.com/flex026/user_avatar/forum.juce.com/jamiebullock/32/459_2.png) [@jamiebullock](https://forum.juce.com/u/jamiebullock)\
**Post date:** [November 10, 2017, 12:00pm UTC](https://forum.juce.com/t/how-to-make-font-rendering-lighter/25086/1 "2017-11-10T12:00:15Z")

</div>

Below are two screenshots, the left from JUCE, the right from PhotoShop.

These are using the same font (Avenir Light), but as can be seen, JUCE’s rendering is significantly heavier. I experience this with all fonts, not just this one, and particularly on OS X.

Is there any way in JUCE to achieve a lighter rendering?

![JUCE](https://us1.discourse-cdn.com/flex026/uploads/juce/original/2X/d/d0c61aa9118da61ed54e287832bbc161111e012a.png) ![Photoshop](https://us1.discourse-cdn.com/flex026/uploads/juce/original/2X/5/53709c763cc5d63c5d3670e3dda2fc769af81923.png)

This issue only applies to light text on dark background. JUCE renders, dark on light with a lighter weight.

---

<div class="post-metadata">

**Author:** ![jamiebullock](https://sea2.discourse-cdn.com/flex026/user_avatar/forum.juce.com/jamiebullock/32/459_2.png) [@jamiebullock](https://forum.juce.com/u/jamiebullock)\
**Post date:** [November 23, 2017, 4:43pm UTC](https://forum.juce.com/t/how-to-make-font-rendering-lighter/25086/2 "2017-11-23T16:43:10Z")

</div>

I’m guessing this got lost in the ADC week, but does anyone have any thoughts on this?

JUCE’s light on dark font rendering is consistently heavier than other OS X applications and this is a problem for us I can’t match the weight in any of our designs.

---

<div class="post-metadata">

**Author:** ![mayae](https://avatars.discourse-cdn.com/v4/letter/m/9fc29f/32.png) [@mayae](https://forum.juce.com/u/mayae)\
**Post date:** [November 23, 2017, 5:11pm UTC](https://forum.juce.com/t/how-to-make-font-rendering-lighter/25086/3 "2017-11-23T17:11:36Z")

</div>

The CoreGraphics renderer on OS X notoriously fattens up glyphs. The solutions are IIRC:

1. use software renderer all the way to achieve consistent results.

In general, fonts look different on different rendering engines, see this comparison:

 ![](https://us1.discourse-cdn.com/flex026/uploads/juce/original/2X/a/a617b2e6999567de966101c3a591df192d495eb0.gif)

from this topic:

> [@Text rendering suggestion: Need Jules' eyes](https://forum.juce.com/t/text-rendering-suggestion-need-jules-eyes/14305):
>
> (Don't worry Jules; this isn't about font hinting!) I've messed around with Juce's text rendering a lot, because I wasn't really satisfied with it (on Windows). It looks great on OSX, because the default renderer uses OSX's subpixel renderer - however, on Windows it uses a software antialiased approach. The problem is, that the gamma-change you introduced, while generally improving appearance, made it seem like different characters had different weights. I then decided to create a subpixel ren…

---

<div class="post-metadata">

**Author:** ![jamiebullock](https://sea2.discourse-cdn.com/flex026/user_avatar/forum.juce.com/jamiebullock/32/459_2.png) [@jamiebullock](https://forum.juce.com/u/jamiebullock)\
**Post date:** [November 27, 2017, 9:59am UTC](https://forum.juce.com/t/how-to-make-font-rendering-lighter/25086/4 "2017-11-27T09:59:53Z")

</div>

Thanks @mayae, I saw that thread before posting here and got hopelessly lost!

It wasn’t clear from me how much of the code proposed in the thread had made its way into JUCE, and looking at the JUCE code I couldn’t figure out, how to change font weight.

> 1. use software renderer all the way to achieve consistent results.

What does that mean in practical terms?

Thanks.

---

<div class="post-metadata">

**Author:** ![jamiebullock](https://sea2.discourse-cdn.com/flex026/user_avatar/forum.juce.com/jamiebullock/32/459_2.png) [@jamiebullock](https://forum.juce.com/u/jamiebullock)\
**Post date:** [November 27, 2017, 10:36am UTC](https://forum.juce.com/t/how-to-make-font-rendering-lighter/25086/5 "2017-11-27T10:36:56Z")

</div>

BTW, I’m not convinced that OS X is to blame here. Testing in Pages and Keynote, the text in my OP is just as light if not slightly lighter than Photoshop. From top to bottom below, JUCE, Photoshop, Pages

![05](https://us1.discourse-cdn.com/flex026/uploads/juce/original/2X/d/d94adf2181494c73f6124650a78eeb5ad552f409.png)  
 ![50](https://us1.discourse-cdn.com/flex026/uploads/juce/original/2X/3/3653dac5723ef7f727419508f7f0e3d04f05080b.png)  
 ![22](https://us1.discourse-cdn.com/flex026/uploads/juce/original/2X/5/5260df346a9ae30ed307421abbb7f44de4c28a0d.png)

PhotoShop has a font rendering weight selector (below), and it would be amazing if JUCE’s rendering had similar capability to configure weight.

![32](https://us1.discourse-cdn.com/flex026/uploads/juce/original/2X/c/c11d6c487f5cf016c93f021abb3c3e55651780ce.png)

---

<div class="post-metadata">

**Author:** ![stevehuey](https://avatars.discourse-cdn.com/v4/letter/s/258eb7/32.png) [@stevehuey](https://forum.juce.com/u/stevehuey)\
**Post date:** [November 29, 2017, 1:32am UTC](https://forum.juce.com/t/how-to-make-font-rendering-lighter/25086/6 "2017-11-29T01:32:01Z")

</div>

@jamiebullock - I’d expect Pages and Keynote to render text using the macOS APIs, however Photoshop is likely using a custom approach and won’t rely on the same APIs as Pages, Keynote, or most native Mac apps.

---

<div class="post-metadata">

**Author:** ![martinrobinson-2](https://sea2.discourse-cdn.com/flex026/user_avatar/forum.juce.com/martinrobinson-2/32/630_2.png) [@martinrobinson-2](https://forum.juce.com/u/martinrobinson-2)\
**Post date:** [November 29, 2017, 9:48am UTC](https://forum.juce.com/t/how-to-make-font-rendering-lighter/25086/7 "2017-11-29T09:48:21Z")

</div>

I think this is just an illusion based on the font hinting

![image](https://us1.discourse-cdn.com/flex026/uploads/juce/original/2X/b/b407ca489f6e25960ca9e1a45b8212f7393190a0.png)

They are the same size zoomed in, but it just looks different when viewed normally.

The difference is slightly less noticeable if you turn off font smoothing in the CoreGraphicsContext:

```
...
CoreGraphicsContext::CoreGraphicsContext (CGContextRef c, const float h, const float scale)
    : context (c),
      flipHeight (h),
      targetScale (scale),
      lastClipRectIsValid (false),
      state (new SavedState())
{
    CGContextRetain (context);
    CGContextSaveGState (context);
    CGContextSetShouldSmoothFonts (context, false); //<---
    CGContextSetAllowsFontSmoothing (context, false); //<---
    CGContextSetShouldAntialias (context, true);
...

```

![image](https://us1.discourse-cdn.com/flex026/uploads/juce/original/2X/c/c8f7bfcd151d778725c21864e5dede1bb91170ff.png)

---

<div class="post-metadata">

**Author:** ![jamiebullock](https://sea2.discourse-cdn.com/flex026/user_avatar/forum.juce.com/jamiebullock/32/459_2.png) [@jamiebullock](https://forum.juce.com/u/jamiebullock)\
**Post date:** [November 29, 2017, 3:37pm UTC](https://forum.juce.com/t/how-to-make-font-rendering-lighter/25086/8 "2017-11-29T15:37:21Z")

</div>

Thanks @martinrobinson-2 good catch on the optical illusion. I just tried turning off font smoothing and it does make quite a big difference when viewed across an entire UI.

I still think it would be good to have more control over font weight in JUCE though. It feels a bit heavy-handed dipping right down into CG Context for things like this.

---

<div class="post-metadata">

**Author:** ![JeffMcClintock](https://sea2.discourse-cdn.com/flex026/user_avatar/forum.juce.com/jeffmcclintock/32/21430_2.png) [@JeffMcClintock](https://forum.juce.com/u/JeffMcClintock)\
**Post date:** [December 1, 2017, 7:16am UTC](https://forum.juce.com/t/how-to-make-font-rendering-lighter/25086/9 "2017-12-01T07:16:48Z")

</div>

Below link might be relevant. (I think the fix is to disable sub-pixel anti-aliasing).

“Mac OS X White/Light Text Sub-Pixel Antialiasing Bug”

[http://www.lighterra.com/articles/macosxtextaabug/](http://www.lighterra.com/articles/macosxtextaabug/)

---

<div class="post-metadata">

**Author:** ![gavinburke](https://avatars.discourse-cdn.com/v4/letter/g/e19adc/32.png) [@gavinburke](https://forum.juce.com/u/gavinburke)\
**Post date:** [April 12, 2018, 12:38am UTC](https://forum.juce.com/t/how-to-make-font-rendering-lighter/25086/10 "2018-04-12T00:38:23Z")

</div>

![image](https://us1.discourse-cdn.com/flex026/uploads/juce/original/2X/3/3143ff2c57df7ad2a3932c0e0ffb79be67d3ccaa.jpg)

Have been looking into making text more legible at small font sizes. The second line is from Ableton, who I feel get it right in terms of correct font selection for legibility and also rendering (they are German after all). The first line is a similiar font to Ableton’s custom one (by [https://lettersfromsweden.se](https://lettersfromsweden.se)), but with @martinrobinson-2 recommendation of disabling font smoothing in the graphics context and finally in the last line, we have the same font with font smoothing enabled. To my eyes, font smoothing actually messes up legibility especially at small sizes. It is very apparent in the dot over the ‘i’ and the "L’ in Live.

Would be great to have a function added to the graphics context class that allows for disabling of smoothing, rather than editing the framework directly. @martinrobinson-2 great find btw, have been annoyed by Juce’s font rendering for years, but seems it wasn’t really Juce all along!

---

<div class="post-metadata">

**Author:** ![gavinburke](https://avatars.discourse-cdn.com/v4/letter/g/e19adc/32.png) [@gavinburke](https://forum.juce.com/u/gavinburke)\
**Post date:** [June 3, 2018, 8:29pm UTC](https://forum.juce.com/t/how-to-make-font-rendering-lighter/25086/11 "2018-06-03T20:29:11Z")

</div>

We turned off font smoothing as per above so we could have consistency between OS-X and Windows. From beta testing it seems to have solved a problem that some mac users were having (mac pros with ati radeon hd 5770). The plug-in interface was taking ~5 seconds to open, turn smoothing off and goes down to 1.5 seconds. Would be great to have font smoothing on/off as a settable parameter of the Font class so as to avoid hacking the framework.

---

<div class="post-metadata">

**Author:** ![kunz](https://avatars.discourse-cdn.com/v4/letter/k/f19dbf/32.png) [@kunz](https://forum.juce.com/u/kunz)\
**Post date:** [June 18, 2018, 10:29am UTC](https://forum.juce.com/t/how-to-make-font-rendering-lighter/25086/12 "2018-06-18T10:29:46Z")

</div>

I would like to see this too. A general switch would do the job for me but it’s also ok if it’s part of the font itself. @roli is this something you can add? I don’t want to modify the framework code. I think font smoothing could be even switched off by default…

---

<div class="post-metadata">

**Author:** ![jules](https://avatars.discourse-cdn.com/v4/letter/j/41988e/32.png) [@jules](https://forum.juce.com/u/jules)\
**Post date:** [June 18, 2018, 11:04am UTC](https://forum.juce.com/t/how-to-make-font-rendering-lighter/25086/13 "2018-06-18T11:04:14Z")

</div>

> [@Gav](#):
>
> The plug-in interface was taking ~5 seconds to open, turn smoothing off and goes down to 1.5 seconds.

That is really odd… Did you profile it? Would be really interesting to see which functions are using up all that CPU.

OK, good request, I’ll add a macro to let you turn it off, though I think making it off by default would probably change the appearance of existing apps too much for it to be something we could use as a default.

---

<div class="post-metadata">

**Author:** ![gavinburke](https://avatars.discourse-cdn.com/v4/letter/g/e19adc/32.png) [@gavinburke](https://forum.juce.com/u/gavinburke)\
**Post date:** [June 18, 2018, 7:30pm UTC](https://forum.juce.com/t/how-to-make-font-rendering-lighter/25086/14 "2018-06-18T19:30:27Z")

</div>

@jules

A macro would be great. Turning font smoothing off on OSX allowed us to have unified font sizes between Windows and OSX, before we were checking the platform and using different font weights etc to get the two similar.

It is super odd, I haven’t been able to recreate it as I didn’t have access to a mac pro here. We just turned off font smoothing on OSX as the only change in a beta build and people came back saying the slow instantiation was solved. Also it was only _instantiation_ of the editor that was slow, once created everything was fine. Don’t know if that helps in anyway!

---

<div class="post-metadata">

**Author:** ![jules](https://avatars.discourse-cdn.com/v4/letter/j/41988e/32.png) [@jules](https://forum.juce.com/u/jules)\
**Post date:** [June 18, 2018, 8:14pm UTC](https://forum.juce.com/t/how-to-make-font-rendering-lighter/25086/15 "2018-06-18T20:14:44Z")

</div>

Well, presumably the smoothing algorithm must have to run on a font while it’s being loaded, and it must take some time. Just seems bizarre that it could take so long - I was wondering if perhaps you’ve got something weird your code that’s repeatedly forcing a typeface to be reloaded or something, because even 1.5 seconds seems a bit long just to get a window on screen.

---

<div class="post-metadata">

**Author:** ![CrushedPixel](https://sea2.discourse-cdn.com/flex026/user_avatar/forum.juce.com/crushedpixel/32/8654_2.png) [@CrushedPixel](https://forum.juce.com/u/CrushedPixel)\
**Post date:** [July 25, 2018, 10:04am UTC](https://forum.juce.com/t/how-to-make-font-rendering-lighter/25086/16 "2018-07-25T10:04:08Z")

</div>

What are the plans for adding the macro? Can we expect this feature soon?

---

<div class="post-metadata">

**Author:** ![jules](https://avatars.discourse-cdn.com/v4/letter/j/41988e/32.png) [@jules](https://forum.juce.com/u/jules)\
**Post date:** [July 25, 2018, 10:58am UTC](https://forum.juce.com/t/how-to-make-font-rendering-lighter/25086/17 "2018-07-25T10:58:04Z")

</div>

We already added it: JUCE\_DISABLE\_COREGRAPHICS\_FONT\_SMOOTHING

---

<div class="post-metadata">

**Author:** ![CrushedPixel](https://sea2.discourse-cdn.com/flex026/user_avatar/forum.juce.com/crushedpixel/32/8654_2.png) [@CrushedPixel](https://forum.juce.com/u/CrushedPixel)\
**Post date:** [July 25, 2018, 11:12am UTC](https://forum.juce.com/t/how-to-make-font-rendering-lighter/25086/18 "2018-07-25T11:12:09Z")

</div>

Nice. Which version of JUCE do I need to use it? Is it already in a stable release?

---

<div class="post-metadata">

**Author:** ![jules](https://avatars.discourse-cdn.com/v4/letter/j/41988e/32.png) [@jules](https://forum.juce.com/u/jules)\
**Post date:** [July 25, 2018, 11:16am UTC](https://forum.juce.com/t/how-to-make-font-rendering-lighter/25086/19 "2018-07-25T11:16:25Z")

</div>

It’s on develop. Don’t know if it’s made it onto master yet.

---

<div class="post-metadata">

**Author:** ![Liam](https://sea2.discourse-cdn.com/flex026/user_avatar/forum.juce.com/liam/32/8050_2.png) [@Liam](https://forum.juce.com/u/Liam)\
**Post date:** [March 2, 2020, 1:41am UTC](https://forum.juce.com/t/how-to-make-font-rendering-lighter/25086/20 "2020-03-02T01:41:48Z")

</div>

JUCE how to use SUBPIXEL RENDERING, Font display has a great impact in other languages。  
I think that is JUCE biggest issue.I very much hope it can be improved!  
 ![image](https://us1.discourse-cdn.com/flex026/uploads/juce/original/2X/3/364c76c5c1273ba42cd54f032dc11a0e32bfa070.png)  
[https://www.grc.com/ctwhat.htm](https://www.grc.com/ctwhat.htm)