Hi, I'm Sean.
Co-founder & CTO at B3, building a crypto agent & decentralized inference — previously Coinbase. I sweat the small details in software, and leave the good parts (components, free tools & writeups) out in the open here.
Components
all →
Screen Recorder
Record your screen, a window, or a tab right in the browser with getDisplayMedia + MediaRecorder: live preview, a running timer, playback, and a webm download. Nothing leaves the device.
Network Status
An online/offline indicator on navigator.onLine and the online/offline events: a live pill plus a toast that slides in on every change and auto-dismisses.
Battery Status
A live battery readout on the Battery Status API: animated fill, color by charge, a charging bolt, and time-to-full. Falls back to a simulation where the API is missing.
Share Button
A share button on the Web Share API: opens the native share sheet where supported, and falls back to a copy-link + social-intents menu everywhere else.
Image Pixelator
Drop an image and pixelate it — drawn tiny then scaled back up with smoothing off, so it renders as crisp blocks. Block-size presets, full-res PNG export, transparency kept.
Progressive Blur
A graduated blur — stacked backdrop-filter layers, each masked to an overlapping gradient band, so the blur ramps smoothly instead of stepping. Shown fading the edges of a marquee.
Writing
all →Switch to cubic-bezier over ease and linear
A one-line upgrade for CSS animations: trade the default ease and linear for cubic-bezier(0.6, 0.6, 0, 1). It starts fast and settles slow, which reads as smooth. Push the curve past 1 and you get a bounce.
One line of JavaScript for a real share sheet
The Web Share API hands a title, text, and URL to the operating system and opens the same native share sheet every app uses. Here's a share button that uses it, with a graceful fallback for desktop.
Recording the screen with two browser APIs
getDisplayMedia grabs a stream of the screen, window, or tab; MediaRecorder captures it to a webm you can play back and download. A full screen recorder, no libraries, nothing uploaded.
Reading the battery in the browser
The Battery Status API gives you charge level, charging state, and time-to-full from JavaScript, and pushes events when they change. Here's a battery widget built on it, with a fallback for the browsers that dropped it.
Knowing when the user goes offline
navigator.onLine plus the online and offline events give you reactive connectivity in a few lines. Here's a status pill and a slide-in toast built on them, with the one caveat worth knowing.
An image pixelator in two drawImage calls
Drop a picture, pick a block size, export a pixel-art PNG. The whole effect is drawing the image tiny, then scaling it back up with image smoothing turned off.