---
title: Browser Support - Vuetify0 Compatibility
meta:
- name: description
content: Browser compatibility matrix for Vuetify0 headless UI. Learn which browsers support v0 features and recommended browsers for the documentation site.
- name: keywords
content: vuetify0, browser support, compatibility, Chrome, Firefox, Safari, Edge
features:
order: 3
level: 1
related:
- /introduction/getting-started
- /introduction/frequently-asked
- /components/disclosure/popover
---
# Browser Support
Vuetify0 targets modern evergreen browsers. Some features require newer browser versions or degrade gracefully when unavailable.
## Baseline Support
Vuetify0 requires Vue 3.5+, which targets browsers with native [ES2016 support](https://caniuse.com/es6):
| Browser | Minimum Version |
|---------|----------------:|
| Chrome | 52+ |
| Edge | 79+ |
| Firefox | 52+ |
| Safari | 10.1+ |
| Opera | 39+ |
> [!WARNING]
> Internet Explorer is not supported and never will be.
## Feature Compatibility
Some v0 features use modern browser APIs that have varying levels of support. The library includes feature detection and graceful degradation where possible.
### Cutting-Edge Features
These features require the latest browser versions and may not work in all browsers:
| Feature | | | | | Fallback |
|---------|---:|---:|---:|---:|----------|
| [CSS Anchor Positioning](https://caniuse.com/css-anchor-positioning) | 125+ | 147+ | 26+ | 125+ | Properties ignored |
| [Popover API](https://developer.mozilla.org/en-US/docs/Web/API/Popover_API) | 114+ | 125+ | 17+ | 114+ | Optional chaining |
| [Scrollend Event](https://developer.mozilla.org/en-US/docs/Web/API/Element/scrollend_event) | 114+ | 109+ | 26.2+ | 114+ | `createVirtual` `scrollend()` aliases `scroll`; no automatic event fallback |
| [Temporal](https://caniuse.com/temporal) | 144+ | 139+ | —[^safari-temporal] | 144+ | `@js-temporal/polyfill` |
[^safari-temporal]: Temporal is not yet in stable Safari (available in Safari Technology Preview). `useDate`'s `V0DateAdapter` automatically uses the [@js-temporal/polyfill](https://www.npmjs.com/package/@js-temporal/polyfill) peer when native Temporal is absent. The API reached TC39 Stage 4 (ES2026) in 2026.
### Well-Supported Features
These features have broad browser support with proper feature detection:
| Feature | | | | | Fallback |
|---------|---:|---:|---:|---:|----------|
| [Native Dialog](https://developer.mozilla.org/en-US/docs/Web/API/HTMLDialogElement/showModal) | 37+ | 98+ | 15.4+ | 79+ | Optional chaining |
| [ResizeObserver](https://caniuse.com/resizeobserver) | 64+ | 69+ | 13.1+ | 79+ | Feature detection |
| [IntersectionObserver](https://caniuse.com/intersectionobserver) | 51+ | 55+ | 12.1+ | 79+ | Feature detection |
| [MutationObserver](https://caniuse.com/mutationobserver) | 26+ | 14+ | 6+ | 12+ | Feature detection |
| [matchMedia](https://caniuse.com/matchmedia) | 10+ | 6+ | 5.1+ | 12+ | Feature detection |
| [Pointer Events](https://caniuse.com/pointer) | 55+ | 59+ | 13.1+ | 79+ | Assumed available |
### SSR & Hydration Safety
All composables use the `IN_BROWSER` constant and `useHydration` composable to ensure safe server-side rendering:
```ts
import { IN_BROWSER, useHydration } from '@vuetify/v0'
const { isHydrated } = useHydration()
// Browser APIs are only accessed after hydration
if (isHydrated.value && IN_BROWSER) {
// Safe to use browser APIs
}
```
## Feature Detection Constants
v0 exposes feature detection constants for conditional logic:
```ts
import {
IN_BROWSER,
SUPPORTS_TOUCH,
SUPPORTS_MATCH_MEDIA,
SUPPORTS_OBSERVER,
SUPPORTS_INTERSECTION_OBSERVER,
SUPPORTS_MUTATION_OBSERVER,
} from '@vuetify/v0'
```
## Documentation Site
The documentation site you're viewing uses additional modern features for the best experience. For optimal documentation browsing:
| Browser | Recommended Version |
|---------|--------------------:|
| Chrome | 123+ |
| Edge | 123+ |
| Firefox | 120+ |
| Safari | 17.5+ |
| Opera | 109+ |
### Docs-Specific Features
The documentation site uses these modern CSS and browser features:
- **`color-mix()`** — Theme color blending and glass effects
- **`light-dark()`** — Native CSS theme switching
- **`inert` attribute** — Modal focus management
- **CSS Nesting** — Organized stylesheets
- **Backdrop Filter** — Glass morphism effects
- **Service Workers** — Offline support (PWA)
> [!TIP]
> If you experience visual issues or missing features while browsing the docs, try updating to the latest version of your browser.
## Known Limitations
### CSS Anchor Positioning
The `Popover` component uses CSS Anchor Positioning for automatic placement relative to trigger elements. Support landed in all major engines between mid-2024 and early 2026, so only recent versions have it:
- **Chrome 125+**: Full support
- **Edge 125+**: Full support
- **Firefox 147+**: Full support
- **Safari 26+**: Full support
When anchor positioning is unavailable, the CSS properties are simply ignored. Pass the shipped [FloatingUIPopoverAdapter](/composables/system/use-popover#adapters) (`@vuetify/v0/popover/adapters/floating-ui`) if you need to support older browser versions.
### Popover API
The native Popover API provides built-in light dismiss behavior and top-layer rendering. Support is growing but not universal:
- **Chrome 114+**: Full support
- **Edge 114+**: Full support
- **Firefox 125+**: Full support
- **Safari 17+**: Full support
- **Opera 100+**: Full support
The v0 Popover component uses optional chaining (`element.showPopover?.()`) to gracefully handle missing API support.
### Native Dialog
The `