Fonts are Heavier in v2.0

[cgilmore]

• I am on the latest Hyper.app version
• I have searched the issues of this repo and believe that this is not a duplicate

• OS version and name: OS X 10.11.6
• Hyper.app version: 2.0

Issue

After updating to v2.0 I noticed that the font rendering is heavier than before. I've tried changing the fontWeight setting to either "light" or "thin" and there's no change. Below I've included a screen shot of how Hyper compares to iTerm and Terminal.

(iTerm/Terminal/Hyper)

Editing other font values in my .hyper.js file does seem to work appropriately (fontSize, fontFamily…), so Hyper is responding to my .hyper.js.

Thanks

[Tyriar]

@sikthought could you try setting it to 100 or lighter and let me know if that works? It should take a CSS <font-weight> value.

[francisdb]

there are a bunch of similar tickets like #2505, #2714 and #51

[ButchMonkey]

I found that my fonts are thinner since updating, and the fontWeight options are having no effect.
(Font size : 12px)

[Tyriar]

From #2714 (comment) it sounds like 100 works, please confirm 😃

[francisdb]

The fontWeight setting seems to be ignored. Tried hyper, preferences... and then changing fontWeight to different values. Restarting hyper but still the same font in use.

Maybe related to old files from a previous release?

[cgilmore]

@Tyriar — Sorry, it doesn't seem to be effecting anything ('lighter' also didn't seem to have any effect).

(.hyper.js/Hyper/Terminal/iTerm)

I also checked to be sure, and Terminal and iTerm are set on Regular as their weight inside of their preferences.

[Tyriar]

@sikthought Hyper in the screenshot is using a different font though (look at the l). This is the same in your original report, make sure the font families you're comparing are identical.

[cgilmore]

@Tyriar — Hmmmm…

Here's what I have, tho:

Hyper:

Terminal:

iTerm:

I also just checked VSCode, it is also set with IBM Plex Mono and is showing what the iTerm and Terminal is showing.

So, it looks like Hyper isn't loading Plex Mono at all and is falling back to Fira Code (I also tried "IBMPlexMono" without spaces like in VSC). However, that weight issue still applies:

(all with Fira Code this time)

[Tyriar]

Fira Code in VS Code (size 11, weight "100") and Terminal.app (size 11pt, weight "Light") seem fine:

(VS Code/Terminal.app)

Maybe it's related to Hyper if my screenshot looks fine to you.

[cgilmore]

So, I just tried a fresh install (deleting the app and all files associated with it), to see if a clean config will help. I am getting Plex Mono to load fine—so all my ls are the correct ls 🙃—but being able to change the weight is still unresponsive (even going heavier).

[neeklamy]

@sikthought – I hate to do this, but your Hyper config is calling for “IMB Plex Mono”.

[Tyriar]

Eagle eye @neeklamy 🦅

[cgilmore]

@neeklamy — FML 🤣

Well, it worked itself out in the end anyway. 👍🏼

[igoticecream]

I'm having this issue, i just can't change the weight of the font since v2.0... it's always bold. Any solution?

Downgraded to 1.4.6 and theres no issue

Edit: Hyper updated by itself without im accepting it and now im stuck with bold fonts on v2.0... how to disable auto update?

[albinekb]

You can disable updates for stable by adding releases.hyper.is to your hosts file, you can google how to do this.

[iameli]

Am also having trouble adjusting fontWeight in 2.0.0-canary.18 on macOS. This is Fira Code with a ostensible fontWeight of "100"

The same text rendered by VS Code's integrated terminal for comparison. It's subtle, but Hyper is definitely blurrier.

They look identical if I set VS Code's terminal.integrated.fontWeight to normal, so that implies Hyper's not respecting the setting.

[albinekb]

https://github.com/zeit/hyper/blob/bba14f6324b0fbc0a25601a82ef3652638d43d56/lib/components/term.js#L33

We need to double check that this is actually set and is getting forwarded to xterm 👍

[notlmn]

Can confirm that both the fontWeight and fontWeightBold properties are set to normal, but the font is still bold.

[rfgamaral]

I did a little bit of debugging on this issue and compiled Hyper with "xterm": "3.3.0" instead of the current "xterm": "chabou/xterm.js#7cb4b8e" and the problem was gone. Setting fontWeight to light, lighter or something like 100/300/ whatever worked just fine.

I believe it's now up to @chabou to check if this issue is due to an older upstream xterm version being used by Hyper or due to changes on his fork.

[chabou]

@rfgamaral Not exactly. My fork has an unmerged PR for huge performance gain. And this is this xterm PR that introduced this regression. But It has been fixed in this PR after my feedback: xtermjs/xterm.js#1327 (comment)

I'll update my fork ASAP.

[rfgamaral]

Huge performance gain? Awesome!

Thanks for the clarification on the issue :)

[rfgamaral]

@chabou Just wondering if you got to update your fork and consequentially Hyper xterm dependency?

[jcrben]

I loaded up xterm 3.4.1 and it seems to work pretty well.

For those who stumble across this, don't make my mistake: keep in mind that there's also fontWeightBold for text bolded by the shell. Also I imagine this depends on the font - some fonts have light shades and others don't, right? It might be helpful to point users to guidance on picking fonts, loading lighter shades, and so on.

For example, with Menlo from the default fontFamily ("Menlo, DejaVu Sans Mono, Lucida Console, monospace") I tried and only noticed a difference between normal (300) and bold (600). 'light' seems to be unrecognized (100 and 200 are recognized as normal) - I see the same thing that I see with 'aweklfajw':

'Light':

The one I'm using, Source Code Pro, also doesn't recognize 'light' and shows the same weirdness. But it does have different shades for 400 and 500

[chabou]

Will be fixed by #3032

[chabou]

@jcrben thank you for your insights.
We should validate fontWeight (and fontWeightBold) config. Valid values are:
https://github.com/xtermjs/xterm.js/blob/4717619f762dd62397ef21363934a19ecf1d8be1/typings/xterm.d.ts#L14

[chabou]

@jcrben thank you for your insights.
We should validate fontWeight (and fontWeightBold) config. Valid values are:
https://github.com/xtermjs/xterm.js/blob/4717619f762dd62397ef21363934a19ecf1d8be1/typings/xterm.d.ts#L14

[igoticecream]

Any update on this? even on latest canary the problem is there

[jcrben]

This discussion in xterm.js seems possibly related: Font rendering weight heavier than in 2.x

[zhoupro]

I use FiraCode-Retina.ttf,the font is heavier. After use FiraCode-Light.ttf, All is normal.

[poige]

Oh, found that issue ticket. Yep, all the fonts are heavy / gravy meanwhile in iTerm2 you can get "retina" mod which makes them even more slim (I wish it would also trim down bold weights a little bit correspondingly but I've planted a ticket in regards already).

All-in-all: Hyper is close to unusable due to this.