documentPictureInPicture demos
Explore 10 interactive demos showcasing how the Document PiP API enables floating, always-on-top windows with arbitrary HTML content. Click any demo to try it live.
01
Tool Palettes
Floating color picker, emoji picker & gradient builder that follows you across tabs
02
Chat Bubbles
Mini chat panel that stays active while you work in other windows
03
Debug Viewer
Live console logs and network requests in a persistent floating window
04
Data Widgets
Ambient dashboard tiles with live data, waveforms, and system stats
05
Game Minimap
Dynamic minimap that tracks navigation and interaction heatmaps
06
Music Workstation
Detachable panels for sequencer, piano roll, and mixer controls
07
AI Copilot
Persistent AI assistant bubble with live responses and status animations
08
Presence Portal
See collaborator avatars, cursors, and real-time activity rings
09
Secondary Camera
Alternative camera views for 3D scenes and shader previews
10
Tutorial Mode
Interactive walkthrough with step-by-step guidance and progress tracking
Browser Support
The Document Picture-in-Picture API is available in Chrome 116+ and Edge 116+. Check 'documentPictureInPicture' in window for feature detection.