What happens when you let AI build fast—but never guess?

Harry Chuang reveals how he created a nostalgic 8-bit universe using a 95% AI-driven workflow, governed by a strict “Design Constitution” that turns AI into a compliance officer, not a stylist.

Vibe coding, but with rules. Read the full breakdown

Last motion highlights of the year, and it's such a good one! 😍

A carefully curated set of animations to watch, rewind, and get inspired by! Check it out

Thanks to all of you, 2025 was a big year at Codrops! 💙

A year shaped by curiosity, experimentation, and a lot of amazing work from the community.

Thanks to everyone who was part of it!

Here's a look back at what we've been up to

In our latest case study, Artemii Lebedev shares how "Frequency Breathwork" became a site that embodies breath with cyclical flow, subtle motion, and WebGL strings powered by Three.js + the Web Audio API.

Read it here

What helps teams take creative risks, speak up, and learn faster?

Our latest article is a long read in Andrew Woan's signature style on psychological safety, self-awareness, and why they quietly shape the quality of creative work.

Set aside some time and read it here

Pretty epic what Pablo Stanley pulled off with Efecto: a real time WebGL playground for dithering, ASCII, and CRT style effects, built with no prior shader experience.

In our first article of the year, he shares the full story

Today we have a tutorial by Junichi Kasahara showing how to turn a video into 3D voxel cubes, then switch into physics so the cubes drop and scatter.

Learn how to create this satisfying drop.

Today we have a fantastic masterclass by Edoardo Lunardi on creating an infinite, interactive image space!

You'll learn how to create a pannable, never-ending image canvas in React Three Fiber using chunk-based rendering and performance-first optimizations for buttery-smooth exploration.

Don't miss this

From "what’s a string?" to Awwwards Sites of the Day 🐐

Meet Nathan Dallaire, a Toronto-based creative frontend turning Next.js, GSAP & Sanity into beautifully obsessive, high-end web experiences.

Honest, funny, and wildly talented. Read it here

The browser as cinema 🎬

The Spark is a story-first, scroll-driven web experience where motion, sound, UI, and performance work as one.

An in-depth look at how The Digital Panda engineered narrative, emotion, and technical restraint into a truly immersive piece — and why every decision mattered.

A beautiful read

We're kicking off this week with a behind-the-scenes look at Obys’ Design Books and how the team transformed a simple reading list into a tactile web library with stacked-page navigation, paper textures, and smooth motion.

Read it here

Compare the 8 best WordPress themes for designers in 2026—fast builds, clean UI, dependable updates, and WooCommerce depth for reliable, high-performance sites. Read it here

A site for sore eyes 👀

ToyFight® break down how they showcased Flim with Webflow + GSAP, from clean page transitions and SplitText/ScrollTrigger text reveals to Lottie playback tricks, cursor-follow “eyes” and Rapier-powered physics. Read it here

Today we have Valentin Descombes walking us through the creation of a scroll-driven dual-column text animation.

Learn how opposing sine-wave motion, GSAP, and thoughtful performance choices come together to create a smooth, expressive scrolling experience. Read it

Today we’re highlighting art director Victorine Snijders as she shares her creative journey. ✨

From student projects to global brands like Nike, Google, and BMW, she uses design as a tool to solve real, human problems. Read it here

Naked City Films needed a site that stayed in motion without losing control.

SavoirFaire© Faire takes us behind the scenes of a process where restraint, rhythm, and custom systems shape an experience that behaves like film. Read it here

A tutorial by Iqbal Muthahhary on creating smooth CSS Grid layout transitions with the GSAP Flip plugin, showing how to resize and reorder items with minimal JavaScript while maintaining clean, continuous motion.

Read it here

Today we are highlighting Dylan Brouwer who spent years in design-led roles before taking the leap into full-time freelance, embracing motion and no-code to build expressive sites without waiting to become a "traditional" developer.

Discover the top 12 web design tools for 2026 – from AI-powered builders to creative resources for designers.

#promoted

Today, we're excited to share a fantastic tutorial by Thibault Introvigne.

Inspired by the Gommage effect from Clair Obscur: Expedition 33, it breaks down how to create a cinematic dissolve in WebGPU and Three.js, using MSDF text, particle effects, TSL shaders, and selective bloom.

Read it here

We’re so excited to spotlight Daniele Buffa today!

From a childhood surrounded by art in Rome to crafting beautifully polished, motion-forward digital work in London, Daniele shares the experiences, influences, and mindset behind his approach to design. Read it here