> Leaf UI 0.8.1 · Package: @ifhover/leaf-ui · Source: 435bab23cad7d343653d9b63b049c0b0601eeefb
> Browser documentation: https://ifhover.github.io/leaf-ui/en/guide/compatibility.html

> For AI agents: the complete documentation index is available at https://ifhover.github.io/leaf-ui/en/llms.txt, the full documentation bundle is available at https://ifhover.github.io/leaf-ui/en/llms-full.txt.

# Browser compatibility

Use the current or previous stable release of Chrome, Edge, Firefox or Safari.

## Minimum versions

| Browser                                                                                                                                  | Minimum version |
| ---------------------------------------------------------------------------------------------------------------------------------------- | --------------- |
| <span className="leaf-browser-name"><img src={withBase('/browsers/chrome.svg')} width={20} height={20} alt="" /> Google Chrome</span>    | 109 or later    |
| <span className="leaf-browser-name"><img src={withBase('/browsers/edge.svg')} width={20} height={20} alt="" /> Microsoft Edge</span>     | 109 or later    |
| <span className="leaf-browser-name"><img src={withBase('/browsers/firefox.svg')} width={20} height={20} alt="" /> Mozilla Firefox</span> | 121 or later    |
| <span className="leaf-browser-name"><img src={withBase('/browsers/safari.svg')} width={20} height={20} alt="" /> Safari</span>           | 16.4 or later   |

These versions are Leaf UI's minimum support targets, not a claim that every version has been tested. IE, legacy Edge (EdgeHTML) and older WebViews are outside the supported range.

## Features and fallbacks

| Capability           | Implementation and fallback                                                                                                     |
| -------------------- | ------------------------------------------------------------------------------------------------------------------------------- |
| Derived colors       | JavaScript emits concrete color variables; static palettes support initial rendering and standalone CSS                         |
| Background blur      | Standard and WebKit-prefixed filters; unsupported filters use a darker translucent mask; disable with `maskBlur={false}`        |
| Entrance motion      | Keyframes fade the mask; without `@starting-style`, some content appears immediately and remains usable                         |
| Web Animations       | Layout updates immediately when `Element.animate` is unavailable                                                                |
| ResizeObserver       | Optional observers are guarded; window resize continues to measure layouts. Third-party virtualization requires modern browsers |
| IntersectionObserver | Infinite scrolling offers a manual load button                                                                                  |
| Reduced motion       | System preferences and `theme.motion={false}` are honored                                                                       |
| Forced colors        | Keyboard focus and native selection indicators remain visible; text and ARIA communicate status                                 |

```tsx
<ConfigProvider maskBlur={false} theme={{ primaryColor: '#635bff', appearance: 'dark' }}>
  <App />
</ConfigProvider>
```

Use concrete hex/rgb/hsl/named colors through `theme` and `tokens`. A server cannot resolve CSS variables: `var(...)` colors resolve after mounting and synchronize when ancestor class/style attributes change. Pass concrete colors for a deterministic SSR first frame. Changing only a base CSS color does not recalculate the full palette.

## Validation coverage

CI covers Chromium, Firefox, WebKit, React 18/19, SSR and package exports. WebKit coverage does not imply physical Safari/iOS coverage. Local Firefox currently fails to launch (`spawn UNKNOWN`) and is not recorded as passed. See `packages/react/ACCESSIBILITY.md` in the repository for executed checks and manual limits.
