> ## Documentation Index
> Fetch the complete documentation index at: https://docs.embededitor.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Browser Support

> The browsers Embed Editor runs in, and the browser features some of its tools depend on.

Embed Editor runs in Chromium browsers, Firefox and Safari from 2023 on, on desktop and mobile.

## Minimum Versions

| Browser | Minimum | Since |
| - | - | - |
| Chrome, Edge and other Chromium browsers | 111 | March 2023 |
| Firefox | 114, 115 ESR included | June 2023 |
| Safari on macOS | 17 | September 2023 |
| Safari on iOS and iPadOS | 17 | September 2023 |

Each minimum is the oldest version with every feature the editor relies on:

* **Chrome and Edge 111:** CSS `color-mix()`, which the editor's look is drawn with.
* **Firefox 114:** the build's target. Firefox 114 and 115 measure no font box for canvas text, so the editor uses each font's own there, and Annotate's texts land as in any other browser. That keeps Firefox 115 ESR, the last Firefox for Windows 7 and 8.1 and for macOS 10.12 to 10.14.
* **Safari 17:** WebGL 2 on an `OffscreenCanvas`, which Save, the filter and frame previews and the Resize limits draw with. Safari 16 and older (iPhone 8, 8 Plus and X, macOS Big Sur) are not supported.

## Older Browsers

Under the minimums the editor still opens, with a banner under the toolbar: "This browser may not run the editor correctly. Update it for the best experience." **Close Notice** takes it away while the editor is open, and a failure (Save, a mark) shows over it.

The editor reads the features, not the browser's name: CSS `color-mix()` and container queries, and WebGL 2 on an `OffscreenCanvas`. A browser too old to read the editor's code at all (before Safari 16.4) shows nothing. Change its words with the `browserUnsupported` and `noticeClose` messages in `lang.texts`.

## Screen Width

The editor needs 320 px of width or more. It lays itself out by its own width, not the window's, from 320 px up: nothing overflows or overlaps there, under a mouse or a finger. That holds the narrowest phones in full screen and an inline editor inside a page's margins (343 px on a 375 px iPhone with 16 px each side). Narrower, its controls may not fit.

## WebGL 2 Is Required

Without WebGL 2 the editor shows "This browser cannot run the editor (WebGL 2 unavailable)" and calls `onLoadError` with `WEBGL_UNAVAILABLE`.

```tsx App.tsx theme={"dark"}
<EmbedEditor
  onLoadError={(error) => {
    if (error.code === 'WEBGL_UNAVAILABLE') {
      showPlainUpload();
    }
  }}
  src={src}
/>
```

## Features That Depend on the Browser

| Feature | Needs | Where it is missing |
| - | - | - |
| Eyedropper | The EyeDropper API | Shown in Chromium only. |
| Copy | The async clipboard with images, on a secure page | The button hides. |
| Share | The Web Share API with files | The button hides. |
| HEIC photos | Native in Safari | Chromium and Firefox decode it with a bundled decoder, loaded only then. |

## Styles

The editor's CSS goes in as an adopted stylesheet inside its shadow root: no rule of the page reaches it, and none of the editor's leaves it.


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.