An interactive demonstration of Akiyoshi Kitaoka's lightness perception illusion featuring a horizontal gradient and a draggable center square.

I polled you, my social media peers, on what irked and irritated you when it came to paying for things on the web. This is what you said...

A deep dive (ho ho) into the Mandelbrot set rendered with Wasm and WebGPU.

Demo of an Email Verification Protocol (EVP) Issuer

Demo of an Email Verification Protocol (EVP) Relying Party

Pick a post, any Bluesky or Mastodon post! Then explore all the interactions: replies, quotes, likes, reposts in a delightful interactive 3D timeline.

Keep coding fun while learning to use AI/LLM tools that fit my workflow.

Provide vibe, receive tune.

Experimenting with Chrome's built-in AI APIs and Tone.js to create a vibe-based music box.

Quick and dirty entry for the Bad UX World cup where you use the system color picker to select a date.

Quick and dirty entry for the Bad UX World cup where you use the system color picker to select a date.

A CSS conic-gradient and SVG filter watch face inspired by LAWA.

A noise machine for today's modern world.

Animated version of the Lorenz Attractor using Three.js

Newton's disc persistence of vision demo illustrating screen refresh rate limitations.

Quick version of the classic Barnsley Fern fractal with tweakable parameters.

A flat pattern turns into a three-dimensional image when folded.

The classic bouncing DVD logo with clean, efficient CSS animation.

Play an online version of the classic game: Peg Solitaire AKA Solo Noble AKA Brainvita with bonus cat emoji.

Interactive CSS animation showing how points moving along straight tracks form rotating circles and squares.

How Chrome reduces its User-Agent string.

I love you / Satan emoji toggle.

Check if your browser is reporting Chrome major version 100+.

More chaotic attractors creating attractive animated artwork.

Bouncing alien emoji PixiJS canvas.

Chaotic attractors creating attractive artwork.

Testing History API pushState, replaceState, and location methods.

Explore infinite fractals in the Mandelbrot set. Discover beautiful downloadable images and share locations with friends—all with simple, fun controls.

A WebGL-based viewer for the Mandelbrot set.

Interactive PixiJS particle snow blower canvas.

Click and drag to spawn bouncing cat emojis.

Interactive spirograph-style orbital drawing canvas.

Optical illusion where the wheels look like they change position, but they really only spin.

Visualise the atoms from the periodic table of elements.

Visualise the atoms from the periodic table of elements.

Cross-origin iframe restrictions demos.

User-Agent 👀 Client Hints

A melting clock in your browser inspired by Salvador Dalí's painting La persistencia de la memoria (The Persistence of Memory).

Demonstrate the Heavy Ad Intervention ⚖️ in Chrome

How to build a printable zine with the power of CSS grid and print stylesheets.

An emoji version of the classic cellular automata game. Tap the cells to create a pattern. Customize the emoji and then share it!

A tweet from @SteveStuWill and originally from @brusspup reminded me of one of my favourite illusions: Rolling Circles. Each individual circle is just moving back and forth on a straight line, but the combined effect creates a larger movement. Give me a shout at @rowan_m

Inspired by a tweet from @SteveStuWill here's a CSS version of the Stepping Feet illusion.Both rectangles are moving steadily together, but they appear out of sync. Give me a shout at @rowan_m with any comments

CSS selector highlighting images missing alt attributes.

Inspired by tweets from @Chris_Said and @gsarcone here's an SVG version of the Müller-Lyer illusion. None of the coloured lines are moving, they all remain the same length!

Interactive builder for HTTP Set-Cookie headers and attributes.

Test SameSite cookie compatibility.

<input-knob> 🎛️ goes to eleven

Interactive demo of the <input-knob> web component.

How to build a touch-sensitive rotating knob web component.

How to build a touch-sensitive rotating knob web component.

How to build a touch-sensitive rotating knob web component.

How to build a touch-sensitive rotating knob web component.

How to build a touch-sensitive rotating knob web component.

How to build a touch-sensitive rotating knob web component.

How to build a touch-sensitive rotating knob web component.

Jake in the Box

How to build a touch-sensitive rotating knob web component.

How to build a touch-sensitive rotating knob web component.

How to build a touch-sensitive rotating knob web component.

How to build a touch-sensitive rotating knob web component.

Paul ⟳ Spinlan. You spin me right round.

How to build a touch-sensitive rotating knob web component.

CSS animated underwater tentacle and bubbles.

Read 🌐 online or 📃 print out, ✂️ cut, and 🙏 fold to create a physical copy. 💜 Remix and write your own zine!

Interactive chaos game fractal generator.

Rake in peace with a pure CSS Zen garden.

Rainbow pendulum wave CSS animation.

Interactive CSS 3D Advent Calendar.