A swinging robot 🤖 Pure #CSS. Live demo and... full code on CodePen.IO:show more

A fun CSS-only experimentation using modern features (anchor positioning,... @​property, :has(), and more!) for this week #codepenchallenge Demo: via CodePen.IOshow more

Tailwind CSS Tip ✨ You can create a pure... css carousel in Tailwind CSS using scroll snap. Live demo ↓ (21/30) follow for 9 more tips 🔔show 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

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

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 CSS Game! What about a CSS game... that you can play with your keyboard? No, it's not a joke but a reality! Play "Super CSS Mario", the first CSS-Only game playable using your keyboard. CodePen.IO demo in the next tweet 👇 0% JavaScript - 100% CSS Magic! Have fun🤩show more

💡 CSS Tip! Get the scroll progress of the... page as a CSS variable using a few lines of code ✅ Powered by Scroll driven animations ✅ Defined at the root level ✅ Typed using @​property ✅ You can easily use it within any formula CodePen.IO demo in the reply 👇show 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

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

If I had to choose one thing to do,... it would be just coding WebGL flowers It's a GLSL shader, a full-screen plane, and 2 render targets to swap on each frame Live demo & source code: Made with Three.js Hosted on CodePen.IO Special thanks to The Book of Shadersshow more

Tailwind CSS Tip ✨ You can create a floating... input form with Tailwind CSS using ":placeholder-shown" pseudo class. Live Demo & Code 👇 (8/30) follow for 22 more tips 🔔show more

Skewed infinite carousel w/ vignette effect ✨ Built entirely... with Tailwind CSS – zero JavaScript required. Live demo & code 👇show more

Cards Hover Effect woth pure CSS and HTML 🚀🔥... Code in the comments 🧑‍💻show more

Animated checkboxes coded with pure CSS 🚀 Code for... free on the link in the comments 🧑‍💻show 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

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

⚡️ CSS ::highlight() + TreeWalker for dynamic text search:... - No DOM manipulation - Pure CSS ::highlight() styling - Efficient TreeWalker traversal [Code Snippet 👇]show more

Tailwind CSS Tip ✨ You can create some cool... looking loaders and spinners using Tailwind CSS. Thanks to Tailscan for Tailwind CSS for the inspiration. Demo & Code 👇 (14/30) follow for 16 more tips 🔔show more

Shaq escorted out by his robot buddy 🤖😅 🌟... #NBAAllStar is LIVE on TNTshow more

3D Landing Page Template (Source Code - Free)! built... with - Next.js - Tailwind CSS - Three.js - GSAP A lightweight, visually impactful 3D Demo + Source Code (Free) : 1st comment 👇show more