Another minimal JS animation here! Interactive (and damn satisfying)... cursor animation made with only 3kb of pure JS. Not sure how to use it yet – maybe as a base for some shader?.. Anyway, it's fun already :) Live demo & source code: Hosted on CodePen.IOshow more

I wanted to create a broken glass effect with... WebGL for a long time! Here it is: interactive, lightweight (around 10KB of GLSL + vanilla JS), and easy to customise (find more controls on codepen) Live demo & source code: Hosted on CodePen.IOshow more

New #WebGL pattern! A Voronoi diagram (love it) with... eyes calculated over the polar coordinates of each cell. No images or graphic libs here, just a #GLSL shader wrapped with JS Live demo & source code: Hosted on CodePen.IO Special thx to The Book of Shadersshow more

Draw GLSL flowers with your cursor! 🌺 One full-screen... plane, two render targets, and a bit of shader magic Live demo & source code: Made with Three.js Hosted on CodePen.IO Special thanks to The Book of Shaders #webgl #glsl #threejs #shader #drawingtoolshow more

Rube Goldberg HTML form! Tbh I spent way too... much time on this one haha. As fun as it is useless :) Live demo & source code: Hosted on CodePen.IO Made with #GSAP GSAPshow more

GLSL fire shader based on Simplex noise with a... static SVG overlay. No interactivity this time, just sketching on Saturday night ¯\_(ツ)_/¯ Live demo & source code: Made with Three.js Hosted on CodePen.IOshow more

It's October, my dudes! I've redone one of my... fav old works. The updates: - transparent background - no extra libs so just <15kb of code - parameters that are easy to change without going through the shader Live demo & source code: Hosted on CodePen.IOshow more

This glass configurator has no custom shaders or geometries.... Just MeshPhysicalMaterial and a bunch of standard geometries with rendering order set manually. Not 100% realistic but super simple Live demo & source code: Made with Three.js Hosted on CodePen.IOshow more

New favorite noise function! I had lots of fun... tweaking the yonatan shader and ended up using it as a semi-transparent overlay With color changing on scroll and slight cursor response, the total code size is still <9 kb 🫣 Live demo & source code: Original algorithm:show more

onboarding checklist component UI showcase animation. JS, built with... Claude Codeshow more

If you design or vibe code, save this list.... - Kokonut UI; animated React components - Motion Sites; website and animation inspiration - Motion .dev; web animation - Anime .js; JavaScript animation - Particles Casberry; interactive particles and WebGL effects Useful for both design and build.show more

JS sourcemaps are so cool sourcemaps are "mappings" of... generated code (JS that runs on your browser) to the original sourceshow more

You can now use D3.js for building interactive data... visualizations with Lovableshow more

Data Tunnel Demo &amp; Source Code: #threejs #data #ai... #tunnel #animation #Web3show more

Built an interactive Three.js system where click/touch input morphs... 6,000 shader particles between code-generated mathematical structures. Open source code and demo 👇show more

hear me out you don’t need js to create... a marquee animation just a couple of lines of css and duplicated children with `aria-hidden`show more

Tested opus 5.5 on some older work to see... how it would animate a hero we designed using pure js Pretty impressive stuff given it was just a series of jpgsshow more

Finally got to build this. Create animations that use... Core Animation on iOS and Animator on Android with zero JS overhead. Same animation. But one keeps running smoothly even when the UI thread is lagging. Introducing react-native-ease 🍃show more

another fun in-product announcement! designed the svgs in figma... and then built the animation and movement in cursor, this was SO fun to work on because I knew the animation would land in prod exactly as I intendedshow more

You can use interactive artwork created by Rive artists,... like this character, and extend it with Scripting to build a full game. This makes it possible to iterate on code, design, and animation all in one collaborative editor.show more