diff --git a/docs/img/troubleshooting/troubleshooting-chrome.webp b/docs/img/troubleshooting/troubleshooting-chrome.webp new file mode 100644 index 0000000000..a999f41b2d Binary files /dev/null and b/docs/img/troubleshooting/troubleshooting-chrome.webp differ diff --git a/docs/img/troubleshooting/troubleshooting-firefox.webp b/docs/img/troubleshooting/troubleshooting-firefox.webp new file mode 100644 index 0000000000..93c151fee5 Binary files /dev/null and b/docs/img/troubleshooting/troubleshooting-firefox.webp differ diff --git a/docs/user-guide/first-steps/troubleshooting-webgl.njk b/docs/user-guide/first-steps/troubleshooting-webgl.njk new file mode 100644 index 0000000000..bf241d0b1f --- /dev/null +++ b/docs/user-guide/first-steps/troubleshooting-webgl.njk @@ -0,0 +1,107 @@ +--- +title: Troubleshooting WebGL +order: 5 +desc: Diagnose and fix common WebGL issues in Penpot with browser, GPU, and system checks so you can open the workspace canvas correctly. +--- + +

Troubleshooting WebGL

+ +
+

Availability note

+

WebGL renderer is currently not available yet in Penpot production (design.penpot.app).

+

Right now, this renderer is available only in testing environments. It is planned for an upcoming release and should be available soon.

+
+ +

Penpot uses WebGL to render the design canvas. If WebGL is unavailable, Penpot cannot open the workspace canvas correctly.

+ +

Sometimes WebGL appears enabled in your browser, but Penpot still cannot create a graphics context. This is usually related to browser settings, GPU acceleration, drivers, or temporary GPU overload.

+ +

Before changing anything

+
    +
  1. Open https://get.webgl.org.
  2. +
  3. Check the result: + +
  4. +
+ +

Quick checks (2 minutes)

+
    +
  1. Close graphics-heavy tabs/apps (video editors, 3D apps, many design tabs).
  2. +
  3. Reload Penpot.
  4. +
  5. Fully restart the browser.
  6. +
  7. If needed, restart your computer.
  8. +
+

Why this helps: GPU memory or context slots can be temporarily exhausted, even when your configuration is correct.

+ +

Chrome

+
    +
  1. Open chrome://settings/system.
  2. +
  3. Turn on Use graphics acceleration when available.
  4. +
  5. Restart Chrome.
  6. +
  7. Open chrome://gpu and review WebGL-related warnings.
  8. +
+
+ + Chrome system settings with graphics acceleration option + +
+

Why this helps: WebGL depends on hardware acceleration and a healthy GPU process.

+ +

Mozilla Firefox

+
    +
  1. Open Firefox and check that zoom is set to 100% from the top-right menu.
  2. +
  3. From that same menu, open Settings/Preferences.
  4. +
  5. In General settings, confirm Firefox is up to date and run Check for updates if needed.
  6. +
  7. Enable hardware acceleration in Firefox settings.
  8. +
  9. Restart Firefox.
  10. +
  11. Open about:support and review the Graphics/WebGL section.
  12. +
+
+ + Firefox settings showing hardware acceleration configuration + +
+

Why this helps: outdated browser builds, disabled acceleration, or blocked GPU features can prevent context creation.

+ +

Safari

+
    +
  1. Update Safari/macOS to the latest available version.
  2. +
  3. Restart Safari.
  4. +
  5. Re-test in https://get.webgl.org.
  6. +
+

Why this helps: Safari WebGL behavior is strongly tied to OS/browser version and graphics stack updates.

+ +

Settings

+

Some advanced browser configurations or experimental settings can interfere with WebGL. If you have modified these in the past, consider restoring default browser settings or testing in a fresh profile.

+ +

About zoom and trackpad settings

+

In some cases, changing browser zoom or trackpad settings is suggested as a workaround.

+

In Penpot, these are not baseline requirements for WebGL. Treat them only as temporary diagnostics if support explicitly asks for them.

+

If you temporarily changed one of these settings and Penpot starts working, you can usually revert it and test again.

+ +

GPU drivers and OS checks

+
    +
  1. Install any pending OS updates.
  2. +
  3. Update GPU drivers (especially on Windows/Linux).
  4. +
  5. Disable graphics overlays/tools (recording overlays, GPU tuning utilities) and test again.
  6. +
+

Why this helps: outdated or conflicting graphics layers can break WebGL context creation.

+ +

Known edge case: Linux + Nvidia

+

Some Linux + Nvidia combinations can report WebGL as available but still fail at runtime in specific browser/driver combinations.

+

In some cases, switching between proprietary and open-source drivers or updating the NVIDIA driver resolves the issue.

+

If this is your setup, collect diagnostics and contact support.

+ +

If the issue persists

+

Please share:

+ + +

Then contact us at support@penpot.app or open a GitHub issue at https://github.com/penpot/penpot/issues.

\ No newline at end of file