window.magic
Every window is a door. This page is a laboratory for the browser window itself — resize it, drag it, spawn real popups, and watch the particle field and telemetry react in real time.
A window inside the window.
This panel is draggable, scrollable and fully alive. Its scroll position is reported below — proof that a "window" is just another element with opinions.
Try dragging the title bar. The whole card follows your pointer and the page keeps scrolling underneath it.
That's the whole trick: setPointerCapture, a transform, and a little restraint.
The window is the interface.
Most sites treat the browser as a piece of paper. It isn't. It has a viewport, a scroll position, a device pixel ratio, a title, storage, and the ability to open more of itself.
This build leans into all of it: the chrome you're looking at is a fixed window frame, the rail on the right is your scroll position, and the URL up top rewrites itself as you move through the page.
Try it — resize this browser, drag the card, then scroll the page and watch the frame's percentage climb.
Poke the API.
These aren't screenshots. Every card below reads or writes a real browser property, live.
document.title
Rewrite this tab. The change is real.
localStorage
Persist a key across reloads.
navigator.languages
What your browser says about you.
screen & performance
Display and load timing.
pointer tracker
Move your mouse anywhere.
window.scrollTo()
Programmatic scrolling, with easing.
Spawn a real window.
Not an iframe. A separate window.open() document with its own title, its own DOM, and a channel back to this page.
The child window runs a tiny page of its own. Type in it, press ping, and the message lands in this log through BroadcastChannel.