← Back to release summary

CSS picture-in-picture display mode

Category

CSS

Type

Chromium catches up

Status

Enabled by default (Chrome 123)

Intent stage

None

Summary

Adds support to the CSS display-mode media feature for picture-in-picture. This allows web developers to write specific CSS rules that are only applied when (part of the) the web app is shown in picture-in-picture mode.

Motivation

A display-mode media feature for picture-in-picture would allow web developers to write specific CSS rules that are only applied when (part of the) the web app is shown in picture-in-picture mode.

Standards & signals

• Specification: https://drafts.csswg.org/mediaqueries-5/#display-mode-picture-in-picture
• Firefox: No signal — Added comment to existing standards position issue for document picture-in-picture. No response yet
• Safari: No signal — Added comment to existing standards position issue for document picture-in-picture. No response yet
• Web developers: Positive
• Tracking bug: https://issues.chromium.org/issues/41493667

Docs: https://github.com/w3c/csswg-drafts/issues/9260

Samples: https://document-picture-in-picture-api.glitch.me/display-mode.html

View on chromestatus.com