How to use the Lab.

Everything in the Lab is plain HTML, CSS and JavaScript. No framework, no build step. This is how you choose, copy and combine items.

For clients

Browse the categories, click "Add to selection" on everything that appeals to you and send the selection to us from the panel at the bottom right. We reply with a proposal for how it fits your site and brand. You can also share the selection link with colleagues first.

For developers

Every item page shows the HTML, CSS and JavaScript. The CSS classes have a unique prefix per item, so you can drop several items on one page. JavaScript always receives the element that contains the HTML; items never touch the rest of your page. Items that need GSAP, ScrollTrigger or OGL list the script tags in the HTML tab.

Performance

Items are tagged by technique: CSS only, CSS + JS or WebGL. Prefer CSS-only items for content above the fold on mobile. WebGL items fall back to a still image when a device cannot handle them.

Accessibility

Most animated items respect the "reduced motion" setting of the visitor. Forms and menus are keyboard operable. Check contrast against your own brand colours when you change them.

Licences

Items marked "eigen" are built by NedDev (204). The rest come from open-source libraries under MIT (74), Apache-2.0 (4) or FreeBSD (1); keep the copyright line in the code. We do not include code from libraries whose licence forbids republishing.

Seen something you like?

Add it to your selection and send it over. We build your site around it, in your brand.

Get in touch →