Fueling web creativity since 2009. 🔥 ✽ Open source demos: tympanus.net/codrops/hub/ ✽ Website inspiration: tympanus.net/codrops/webzibi…

Portugal
Today we're shining a light on @anoukiap and her approach to photorealistic 3D. See how she builds a project from a first pencil sketch to a finished render for Wabi, and the ideas behind a series of fruit, flowers, and butterflies made almost too real to trust: tympanus.net/codrops/?p=1222… #3d #cgi #cinema4d
11
1,097
Codrops retweeted
loading=lazy 🧑‍🎨
33
73
1,233
44,912
Most cursor trails are just a blob pushing pixels around. This one swaps that for fully custom brush shapes, hatching, dots, whatever you write, using a data texture, a shader, and about ten lines of code. @berto_bau walks through the whole build with Three.js, WebGPU, and TSL: tympanus.net/codrops/?p=1216… #threejs #webgpu #tsl
5
5
66
6,162
Built entirely on @Webflow, Maksym Ponomarenko's yearly portfolio rebuild swings from last year's loud brutalism to quiet minimalism. He breaks down the GSAP blur effect, the WebGL background, and the Barba.js transitions behind bleibtgleich'26: tympanus.net/codrops/?p=1200… #webflow #gsap #portfolio
3
2
32
4,920
Codrops retweeted
We just shipped Quiver 2.0 in @paper This is the best SVG generation possible, it's an incredible leap forward • Much faster AND better quality • Cleaner geometry • New Telos model for detailed work Next level vector generation -- available today in Paper
125
273
3,902
304,755
Where does your site show up in Google vs. AI search? This hands-on tutorial, powered by @cloroai, shows how to build a small Node.js tool that compares Google rankings with the sources cited by ChatGPT, Perplexity, and Google AI Overview. Build it in an afternoon: tympanus.net/codrops/2026/09…
1
1
7
3,415
Codrops retweeted
A lot of people asked me for the sources of the @threejsconf badge, so here they are : hervestudio.github.io/badge-… It's a very DIY project and far from perfect, but that's also what makes it approachable: everything can be rebuilt with a soldering iron, a 3D printer and a few cheap components. I tried to document it as clearly as possible, so you can either build it as is or use it as a starting point for something else. If anything is unclear, just write to me :)
16
33
221
11,148
A peek inside a Barcelona studio that grew from one founder's freelance practice into a team working with adidas, Google Pay, and BUFF. GATZARA shares the story behind that journey, from Xavier Cussó's nearly 20 years at agencies like B-Reel, Resn, and JKR, to side projects like a self-initiated Web3 tattoo art platform that pushed the team outside their comfort zone. Explore their work here: tympanus.net/codrops/?p=1214… #branding #webdesign #digitalstudio
2
3
38
5,437
An AI-generated search answer once described a purely decorative label on a website as a real product code, one that never actually existed. @francescoflow digs into what that means: websites have two readers, humans and machines, and design choices that read as obvious to a person can quietly become "facts" to a system that has no idea they were just visual flourish. Read the article: tympanus.net/codrops/?p=1211…
1
15
5,053
Crumpled paper you can unfold, grab, and throw around, built by baking a Houdini simulation into Vertex Animation Textures and playing it back in Three.js with real physics. @nagasawa_item walks through the whole process here: tympanus.net/codrops/?p=1214… From tricky FBX and EXR exports to smoothing out a messy mesh, it's a fun technical breakdown even if you've never touched Houdini. #threejs #webgl #houdini
1
2
43
5,914
Codrops retweeted
✨ Glyph v0.1.0 coming out party ✨ The typography engine for the web. Finally, text that looks like it came from a native app in your web pipeline. → gpu-first with batched drawing and incremental updates → bitmap, mtsdf and slug in one engine → correct multilingual text, shaping, bidi, cjk, ligatures, font fallback → paragraphs that wrap, justify, flow around shapes and 3d objects → one font pipeline for three.js, R3F, typegpu or your own renderer github.com/pmndrs/glyph
14
72
861
70,678
Kononenko Architectural Bureau wanted a website that felt as considered as its architecture. Designer @liaartem and creative developer @reksaandhika built exactly that, down to sketches and drawings that move and react as part of the interface. Take a look: tympanus.net/codrops/?p=1214…
2
2
25
4,564
HOUSE OF YELLOW wanted a website that moved like their own work: fast, playful, constantly in motion. Ronald De Groot and Mees Verberne built exactly that, turning a bold new brand identity into a scroll-driven, GSAP powered interface where even the play button has its own choreography. Take a look at how they did it: tympanus.net/codrops/2026/09… It's a great example of motion treated as identity, not decoration. #webdesign #motion #gsap
1
1
88
5,701
What happens when a powerful motion engine meets WordPress? Our friends at @KirkiBuilder introduce their Interaction engine, designed to bring timeline-based animation, a library of ready-made motion presets, text effects, parallax, and micro-interactions into the WordPress workflow. Discover the possibilities: tympanus.net/codrops/2025/12… #wordpress
2
35
5,528
It started as a visual experiment made for fun, then became Vivid, an interactive @webflow experience built around motion, pixels, and custom code: tympanus.net/codrops/?p=1202… @panpolevan from @blackleadStudio shares how the team brought the original idea into Webflow, from the visual effects and interactions to rethinking how you move through the page.
9
66
5,986
How do you make the internet a bit less sh*t? @resn_has_no_i has been asking that question for more than two decades, making websites that poke you in the brain with a surprising and delightful stick 👀 Take a look at Resn’s work for Squarespace, Savor, Breakthrough Energy and Tracing Art, and see how the studio brings brand, content and digital experiences to life. Read the full story: tympanus.net/codrops/?p=1209…
3
24
4,749
Building a 3D renderer inside @figma became an exploration of form, light, materials, interaction, and the space between 3D and the design canvas. Aleksei Kipin takes us through the making of Depth, from the first experiments to the interactive website built alongside it. Explore the process: tympanus.net/codrops/?p=1200… #figma #threejs #webgl #3d #creativecoding
2
33
5,735
📼 Yestalgia brings Decathlon’s ’90s-inspired vision to the web with playful interactions, expressive motion, and a cassette-player navigation. We take a closer look at the making of the experience with @QuentinHocde, @jonathandc from @indexstd. Read the story: tympanus.net/codrops/?p=1208…
1
2
18
4,658
And that’s a wrap on the very first @threejsconf! 🇫🇷💙 What an incredible two days. So many amazing talks, experiments, ideas, people and moments all packed into one very special gathering of the Three.js community. ✨ Huge thank you to @makio64 for making it happen, and to all the incredible speakers who shared their work and ideas with us. And a massive ❤️ to our amazing crew on the ground: @houma_hani, @kodydev and Rafael Teixeira. They captured so much of what made these two days special and brought the whole experience back to everyone following along from afar. Now let’s see if they manage to sneak out some boat party impressions… 🚢😂 See the complete recap of the most special moments as we followed them through Paris: tympanus.net/codrops/2026/09… #threejs #threejsconf
5
50
4,585