Skip to content

Labs

Recreate a famous effect, get linked

Pick an effect you have admired on somebody else’s site, work out how it is done, and build your own version from scratch. It goes on this shelf with your name and your link on it, permanently, and you keep the copyright.

It is a fair trade rather than a favour: you get a credit on a page that ranks, and this catalog gets an effect it did not have to design.

The shelf

Nothing on it yet

The shelf is other people’s work, and nobody has sent anything in. Filling it with our own effects relabelled as community experiments would be inventing contributors, so it stays empty until it is not. The first entry gets the top of the page.

What we will and will not publish

Read these before you start rather than after. The first three are the difference between a study of a technique and a copy with the serial numbers filed off — and we are the ones who would be publishing the second one.

  • Build it from behaviour, not from source

    Watch the original, work out what it is doing, write it yourself. Do not lift code, assets, fonts or colours from it. A recreation is a study of a technique; a copy with the serial numbers filed off is just a copy.

  • Name what you recreated

    Every entry says what it is a version of and links to it. That is the courtesy, and it is also what lets a reader judge whether it is a reimplementation or a lift.

  • No brand identity

    The technique is fair game. The wordmark, the logo, the exact brand palette and the product name are not. If the demo is recognisable as a specific company rather than as a specific effect, it needs to be less recognisable.

  • Plain CSS or a small amount of JS

    It has to survive being pasted into somebody else’s project. No build step, no framework requirement, no dependency the reader has to adopt to see it work.

  • It respects reduced motion

    Everything in this catalog does, and an experiment is not exempt. If the effect has nothing to show under `prefers-reduced-motion: reduce`, it needs a still state that is not broken.

  • You get the credit and you keep the work

    Your name and your link sit on the entry permanently. You keep the copyright. If it graduates into the catalog proper it ships under the same MIT terms as everything else, and the credit goes with it.

Send one in

A live demo (a pen, a gist, a deployed page), what you recreated, and how you want to be credited. A person reads every submission against the rules above, which is why there is no form that writes straight to the shelf.

Submit an experiment