The issue is visible in that Poki build on device and browser I’ve tested it on. Windows 11, iOS, Chrome, Safari, Firefox and Edge.
In this project: PlayCanvas 3D HTML5 Game Engine
Do you see the text blurring inside the editor view? Not the launch page but the editor
This is what I’m seeing:
What does it look like on a white background?
This is on Android Chrome
1 Like
LeXXik
July 13, 2026, 8:39am
25
@will , select the camera from the scene hierarchy and enter it’s view. I get this on Win 11, Chrome and Firefox:
1 Like
system
Closed
July 16, 2026, 8:39am
26
This topic was automatically closed 3 days after the last reply. New replies are no longer allowed.
LeXXik
July 19, 2026, 6:32pm
28
Related github issue for reference:
opened 02:56PM - 14 Jul 26 UTC
Hi all, just upgraded to latest pc 2.20.6 and I'm noticing text become garbled a… t a distance that I've not noticed before....
2.2.0.6
<img width="1042" height="76" alt="Image" src="https://github.com/user-attachments/assets/cf64e9d1-3ebe-46ba-b155-126613a83a12" />
<img width="432" height="56" alt="Image" src="https://github.com/user-attachments/assets/034aa592-e0cf-4410-ba0a-83944f57a7c1" />
2.19.5
<img width="1010" height="137" alt="Image" src="https://github.com/user-attachments/assets/5103a17c-21a3-4f21-94b7-b28172103e51" />
1 Like
will
July 22, 2026, 3:05pm
29
Fixed:
main ← fix-msdf-minified-coverage-ramp
opened 02:23PM - 22 Jul 26 UTC
Fixes #9064
Forum: https://forum.playcanvas.com/t/engine-v2-migration-causing-is… sues-with-text-ui/42418
## Problem
#8990 floored `screenPxRange` at 1.0 (the msdfgen default). The MSDF coverage is a linear ramp:
```
coverage = clamp(screenPxRange * (sigDist - edge) + 0.5, 0.0, 1.0)
```
whose half-width in field units is `0.5 / screenPxRange`. At the 1.0 floor the ramp spans the field's **entire [0, 1] range**, so on minified text:
- The **outline/shadow ramps never reach zero**: with max outline (`outline_thickness` uniform = 0.2) coverage at `sigDist = 0` is `clamp(1.0 * (0 + 0.2 - 0.5) + 0.5) = 0.2` — a 20% translucent outline wash across the **entire glyph quad**, even where the field is empty. Adjacent quads overlap in a run of text, so washes stack into the garbled blocks in the issue screenshots.
- The fill ramp `clamp(sigDist)` turns the whole atlas spread into a soft halo, hazing glyph edges.
- The wash pops in/out as the canvas resizes, because resizing moves `screenPxRange` across the wash threshold (`0.5 / (edge - thickness)` ≈ 1.67 for defaults) — the "blur changes as I resize the tab" symptom.
Fonts with a small `pxrange` (the legacy default is 2) hit this at moderate distances; the reporter's white-with-black-outline text is the worst case.
Note: the reporter is on 2.20.6, where mipmapped MSDF atlases (#9002, fixed in v2.21.0) compounded this with corrupted medians. This PR fixes the remaining regression.
## Fix
Raise the minification floor to 2.5, capping the ramp at 0.4 field units (`[edge - 0.2, edge + 0.2]`). The outline ramp then bottoms out at `sigDist = 0.1` for the default edge (0.5) and max outline shift (0.2) — clear of the field's tail, so empty-field pixels get exactly zero coverage.
This is v2.19 far-field parity by construction: the old shader's `smoothstep` window mapped to raw field values `[0.32, 0.68]` (fill) and `[0.12, 0.48]` (max outline); the new floor gives `[0.3, 0.7]` and `[0.1, 0.5]`.
- `screenPxRange >= 2.5` (normal-size text): zero change.
- AA width stays geometric (from uv magnification), so the #8984 shimmer fix and the #2948 true-edge fix are preserved.
- Same change mirrored in the WGSL chunk; verified on WebGL2 and WebGPU.
## Verification
Measured with the repro project from the issue (WendyOne, `pxrange` 8, outlineThickness 1), engine `main`, WebGL2, probing a strip *inside* the glyph quads but above the glyphs (should be pure background), simulating the legacy default `font_pxrange` = 2:
| | floor 1.0 (before) | floor 2.5 (after) |
|---|---|---|
| Mean darkening above glyphs (0 = clean background) | **19.6** | **0.0** |
| Fog pixels through the glyph row (Text-Very-Far) | 373 | 296 |
With the fix, distant text renders with defined dark outlines instead of a translucent haze, and appearance is stable under canvas resize. Side-by-side captures show the floor-1.0 render with visible gray rectangles over the quads, matching the issue screenshots; the floor-2.5 render is clean.
🤖 Generated with [Claude Code](https://claude.com/claude-code)
This will go out with the next engine patch (2.21.1) sometime this week.
2 Likes
will
July 24, 2026, 1:37pm
30
This is now live.
@Devortel can you confirm the problem is now resolved please?
Confirmed, it’s fixed in the launch.playcanvas.com and published builds. It’s still visible in the editor even with engine 2.21.1.
1 Like
will
July 28, 2026, 5:49pm
32
The Editor has now also been upgraded to the latest engine version. So this should also be fixed there too now.
How about the font atlas resolution option you mentioned, is that still on the way?
will
July 29, 2026, 5:13pm
34
So @KPal was working on allowing you to import your own font assets into the Editor which would solve that. I think that’s mostly done so I think you can expect that soon. (I’m sure he’ll follow up with an update when he reads this…)
MLB
July 29, 2026, 8:54pm
35
The same problem I reported many months ago, nobody gave me support
Basically, I’ve come to the conclusion that using the default settings, Linear + Gamma 2.2, the UI text only works correctly on a background of white (255.255.255) or black (0.0.0).
If there are intermediate tones in the background, the engine has trouble rendering the colors the user needs, and it also creates that white border. I don’t know if I’m right, but this is what I can deduce right now. I’m sorry there isn’t a solution to this, even a scripted one.
Gray text with 100% opacity on a bl…
will
July 30, 2026, 5:59pm
36
I’ve updated your original thread with details of the fix.
MLB
July 30, 2026, 8:10pm
37
ok, Now the texts are displayed correctly using engine 2.0. Tnks
1 Like