ryanoasis / nerd-fonts

Iconic font aggregator, collection, & patcher. 3,600+ icons, 50+ patched fonts: Hack, Source Code Pro, more. Glyph collections: Font Awesome, Material Design Icons, Octicons, & more
https://NerdFonts.com
Other
52.6k stars 3.59k forks source link

Missing 1px line at the top of upper-left and upper-right triangles #1629

Open ocosta opened 1 month ago

ocosta commented 1 month ago

🗹 Requirements

🎯 Subject of the issue

Experienced behavior:

When nf-ple-upper_left_triangle or nf-ple-upper_right_triangle are placed right next to a block glyph (eg. nvim and tmux status lines) there is a 1px difference at the top of the triangles. In fact, when we magnify the image, we can see that it's not that the the upper line is missing, there seems to be some anti-aliasing effect (see screenshot below).

Expected behavior:

Glyphs should be perfectly aligned.

Example symbols:

█

🔧 Your Setup

★ Screenshots (Optional)

nvim status bar: image

tmux status bar: image

Magnified: image

Finii commented 1 month ago

Hmm, all the glyphs are on vertical coordinate 1027:

image

But I can see the problem with Tilix and Delugia Regular

image

:thinking:

Ah, this is Delugia 2111.01.2, let me try something more up to date... Using latest JetBrainsMono, less obvious but still visible:

image

Hmm. The other two triangular things are also too low, but that is less obvious.

image

Finii commented 1 month ago

Ah, forgot to mention: This is for LCD and monochrome subpixel rendering. Not for 'none' of course. So probably some rounding error.

Finii commented 1 month ago

Hmm, Cascadia Code has the same problem :-o

image

ocosta commented 1 month ago

@Finii thanks for the additional testing! Also, note that there is a faint vertical line between the block and the triangles, even the lower-left and lower-right ones (even though these last two don't have the "missing" 1px line above them).

Same goes for the "flame" glyphs (E0C0 and E0C2).

Finii commented 1 month ago

I believe they are all a fraction of a pixel too low...

image

See the half-round thing is different top and bottom. Also see the 'smudge' below the bottom triangular things.

Ah, hinting... detail view of the theoretical shape and how it is rendered to pixel shades:

image

image


The vertical lines have a known reason and a possible fix. That fix is employed only at the moment to some (most common) Powerline glyphs and will be expanded to all if there are no negative side effects; in principle the fix can break the glyphs for other clients :grimacing: But so far it seems to be good (no complains yet).

Finii commented 1 month ago

Just wanted to mention that I can imagine that we might not be able to fix that at all - because it is technically impossible to fix.

Meanwhile you can try to change your font size and see if that makes the effect bigger or smaller. I guess the effect is size depended.

The technical problem is that the 'full rectangle' against what we compare is no glyph at all, but just a colored blank. As there is no outline it follows other rules in the font rendering process...

ocosta commented 1 month ago

Got it, thanks for the explanation! Nice to hear that the vertical line might be fixed after all, looking forward to it.

I tried increasing the font size, but the problem kept creeping up :disappointed:

If there was a glyph for the full rectangle, do you think this could maybe guarantee proper alignment? (we would still depend on nvim, tmux etc. also using it, but theoretically this is configurable)

Finii commented 1 month ago

There is FULL BLOCK at 2588, but that does not help much, because the cell height in the terminal will be whatever it is, and if that is 1/4 pixel higher than the actual glyph that will show in some cases.

image

I tried increasing the font size, but the problem kept creeping up

I guess that can mean that for some sizes the problem got smaller?

Finii commented 1 month ago

What I mean, if you would use FULL BLOCK before the Triangular Thing:

image

Finii commented 1 month ago

Hmm, the full block has hints, so that no greyscale pixels are created:

image

But still it is not "tall" enough.

ocosta commented 1 month ago

I guess that can mean that for some sizes the problem got smaller?

Not really, the problem happens differently -- now it overflows the upper border: image

Also, the other triangles (e.g. lower-left) started missing 1px line at the bottom: image

Given this sort of erratic behavior, it does seem like a rounding issue.

Finii commented 1 month ago

Yes, that's the missing hinting, which would prevent greyscale filling of specified pixel-ranges. It might be possible to add appropriate hints (true type instructions and blue zones for the otf fonts), but I have no instant good idea how to do it (what I usually have once the reason for some behavior is clear). :thinking:

ocosta commented 1 month ago

I understand... well, hopefully something will come up, let's give it some time :crossed_fingers: Anyway, I appreciate all the effort so far :clap: