After a lot of testing, I finally managed to identify and resolve the issue with transparency artifacts and color discrepancies in Unity 6, URP 2D, WebGL 2 builds. Sharing my findings here in case someone encounters the same problem.
Issue Description: Unity 6.0.0, URP 2D Renderer. Color Space: Linear. PNG textures with transparency (e.g., soft gradients, shadows, scattered light), exported in sRGB from Photoshop. Using Sprite-Lit-Default shader. Post-Processing enabled on the Camera. WebGL 2 Build. Symptoms:
Banding and artifacts in transparent/gradient areas, distorted colors. Color differences between WebGL 2 and Windows (Direct3D11). Reproduction Steps: Create a new Unity 6 2D URP project. Import PNG textures with gradients and transparency. Use Sprite-Lit-Default shader. Enable Post-Processing on the Camera. Build for WebGL 2. Artifacts and color issues will be visible in gradients and transparent areas. Confirmed Workarounds: I found two reliable ways to eliminate the artifacts:
Disable Post-Processing in the Camera settings. (Disabling the Global Volume component alone is not enough. The Camera’s Post-Processing checkbox must be turned off.)
Enable High Dynamic Range (HDR) in the URP Asset settings:
Go to URP Asset → Post-processing → Grading Mode → High Dynamic Range. Note: While HDR resolves the artifacts, it slightly alters the colors and brightness, which may not be desirable for all projects.
Final Notes: This appears to be a rendering or color sampling issue specifically affecting WebGL 2 with Linear color space and Post-Processing in URP. If there are any alternative solutions that don’t require enabling HDR, I’d appreciate hearing about them.