coderef

Fullscreen APILimited availability

The fullscreen API makes a specific element fill the whole screen and hides most browser UI.

Not yet supported in all major browsers — check the table and provide a fallback.

Browser support

DesktopChrome
1–70Not supported
71+Supportedsince Dec 4, 2018
Current: 155
Edge
12–18Not supported
79+Supportedsince Jan 15, 2020
Current: 154
Firefox
1–63Not supported
64+Supportedsince Dec 11, 2018
Current: 157
Safari
1–16.3Not supported
16.4+Supportedsince Mar 27, 2023
Current: 27
MobileChrome Android
18–70Not supported
71+Supportedsince Dec 4, 2018
Current: 155
Firefox Android
4–63Not supported
64+Supportedsince Dec 11, 2018
Current: 157
Safari iOS
✕Not supportedup to 27
Current: 27

How to use

Not supported in Safari iOS. Use feature detection below and provide a fallback (or a polyfill) for those browsers.

Example

Full syntax and examples are on MDN: exitFullscreen.

Feature detection

CSS · check before using
@supports selector(:fullscreen) {
  /* styles that use :fullscreen */
}

/* or in JavaScript */
if (CSS.supports("selector(:fullscreen)")) {
  // use it
}

Sub-features

Support for each part of the feature (20). The overall table above shows when the whole feature works.

Sub-featureChromeEdgeFirefoxSafariChrome AndroidFirefox AndroidSafari iOS
Document.exitFullscreen71796416.47164✕
Document.exitFullscreen.returns_promise71796416.47164✕
Document.fullscreenElement71796416.47164✕
Document.fullscreenEnabled71126416.47164✕
Document.fullscreenchange_event71796416.47164✕
Document.fullscreenerror_event71796416.47164✕
Element.fullscreenchange_event71796416.47164✕
Element.fullscreenerror_event71796416.47164✕
Element.requestFullscreen71796416.47164✕
Element.requestFullscreen.options_parameter717915116.471151✕
Element.requestFullscreen.options_parameter.navigationUI_option7179✕16.471✕✕
Element.requestFullscreen.returns_promise71796416.47164✕
HTMLIFrameElement.allowFullscreen38122210.13822✕
ShadowRoot.fullscreenElement71796416.47164✕
backdrop.fullscreen69794716.4694716.4
fullscreen71126416.47164✕
fullscreen.all_elements✕✕64✕✕64✕
iframe.allow.fullscreen627980✕6280✕
iframe.allowfullscreen38121810.13818✕
http.headers.Permissions-Policy.fullscreen8888✕✕88✕✕