← Modern UI
Popover
Probing…Popover is a web platform capability in the Modern UI category. Built-in top-layer popovers with light dismiss — no JS library. Supported in Chromium 114+, Firefox 125+, and Safari 17+.
Try it
Loading demo…
Code
<button popovertarget="info">Toggle popover</button>
<div id="info" popover>
Rendered in the top layer, light-dismissable with Esc or outside click.
</div>
// Observe open/close:
info.addEventListener('toggle', (e) => {
console.log(e.newState) // 'open' | 'closed'
})Browser support
Chromium
114
Firefox
125
Safari
17
Frequently asked questions
Which browsers support Popover?
Supported in Chromium 114+, Firefox 125+, and Safari 17+.
Does Popover require HTTPS?
No. Popover works without a secure context, though serving your site over HTTPS is always recommended.
What is Popover used for?
Built-in top-layer popovers with light dismiss — no JS library.
Can I try Popover in my browser?
Yes. shwcs.net runs a live Popover demo that probes your current browser and lets you try the API. Everything runs locally — nothing is sent anywhere.