<?xml version="1.0" encoding="UTF-8"?><rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>Codrops</title>
	<atom:link href="https://tympanus.net/codrops/feed/" rel="self" type="application/rss+xml" />
	<link>https://tympanus.net/codrops</link>
	<description>Fueling web creativity since 2009</description>
	<lastBuildDate>Thu, 20 Aug 2026 13:36:46 +0000</lastBuildDate>
	<language>en-US</language>
	<sy:updatePeriod>
	hourly	</sy:updatePeriod>
	<sy:updateFrequency>
	1	</sy:updateFrequency>
	<generator>https://wordpress.org/?v=6.9.7</generator>
	<item>
		<title>Run Rob Run: Building a Music-Reactive Goo with Three.js and WebGPU</title>
		<link>https://tympanus.net/codrops/2026/08/20/run-rob-run-building-a-music-reactive-goo-with-three-js-and-webgpu/</link>
		
		<dc:creator><![CDATA[Robert Aperios]]></dc:creator>
		<pubDate>Thu, 20 Aug 2026 13:35:23 +0000</pubDate>
				<category><![CDATA[Articles]]></category>
		<category><![CDATA[3D]]></category>
		<category><![CDATA[case study]]></category>
		<category><![CDATA[distortion]]></category>
		<category><![CDATA[gooey]]></category>
		<category><![CDATA[Three.js]]></category>
		<category><![CDATA[web audio api]]></category>
		<guid isPermaLink="false">https://tympanus.net/codrops/?p=119350</guid>

					<description><![CDATA[Exploring the techniques behind an audio-reactive 3D scene, from custom geometry deformation and music analysis to scroll-driven morphing, damping, and performance optimization.]]></description>
		
		
		<enclosure url="https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2026/08/scene-morph.mp4?x57826" length="2610535" type="video/mp4" />

			</item>
		<item>
		<title>Relighting Images with Depth Maps and Three.js</title>
		<link>https://tympanus.net/codrops/2026/08/19/relighting-images-with-depth-maps-and-three-js/</link>
		
		<dc:creator><![CDATA[Dominik Fojcik]]></dc:creator>
		<pubDate>Wed, 19 Aug 2026 14:42:19 +0000</pubDate>
				<category><![CDATA[Tutorials]]></category>
		<category><![CDATA[3D]]></category>
		<category><![CDATA[Three.js]]></category>
		<category><![CDATA[TSL]]></category>
		<category><![CDATA[webgpu]]></category>
		<guid isPermaLink="false">https://tympanus.net/codrops/?p=119000</guid>

					<description><![CDATA[Explore how depth maps, TSL, and WebGPU can be combined to turn flat 2D images into dynamic surfaces with realistic lighting, surface detail, and self-shadowing.]]></description>
		
		
		<enclosure url="https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2026/08/codrops-relightning-edit.mp4?x57826" length="2315982" type="video/mp4" />

			</item>
		<item>
		<title>Building an Animated Testimonial Hero Using the GSAP Timeline and Dynamic CMS Data</title>
		<link>https://tympanus.net/codrops/2026/08/18/building-an-animated-testimonial-hero-using-the-gsap-timeline-and-dynamic-cms-data/</link>
		
		<dc:creator><![CDATA[Jonas Arleth]]></dc:creator>
		<pubDate>Tue, 18 Aug 2026 13:39:35 +0000</pubDate>
				<category><![CDATA[Tutorials]]></category>
		<category><![CDATA[3D]]></category>
		<category><![CDATA[grid]]></category>
		<category><![CDATA[GSAP]]></category>
		<category><![CDATA[Webflow]]></category>
		<guid isPermaLink="false">https://tympanus.net/codrops/?p=118923</guid>

					<description><![CDATA[Learn how to build a dynamic testimonial hero in Webflow using CMS data, a custom JavaScript counter, and GSAP’s visual timeline.]]></description>
		
		
		<enclosure url="https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2026/08/codrops-part1-01-1080p.mp4?x57826" length="5344201" type="video/mp4" />
<enclosure url="https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2026/08/codrops-part1-02-counter.mp4?x57826" length="3341488" type="video/mp4" />
<enclosure url="https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2026/08/codrops-part3-05.mp4?x57826" length="1801978" type="video/mp4" />
<enclosure url="https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2026/08/codrops-part3-02.mp4?x57826" length="2422442" type="video/mp4" />
<enclosure url="https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2026/08/codrops-part3-03.mp4?x57826" length="1068239" type="video/mp4" />
<enclosure url="https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2026/08/codrops-part3-04.mp4?x57826" length="1820906" type="video/mp4" />

			</item>
		<item>
		<title>Creativity at Enterprise-Scale, Without Compromise: The OFF+BRAND. Story</title>
		<link>https://tympanus.net/codrops/2026/08/17/creativity-at-enterprise-scale-without-compromise-the-offbrand-story/</link>
		
		<dc:creator><![CDATA[OFF+BRAND]]></dc:creator>
		<pubDate>Mon, 17 Aug 2026 13:09:24 +0000</pubDate>
				<category><![CDATA[Articles]]></category>
		<category><![CDATA[Studio/Agency Spotlight]]></category>
		<guid isPermaLink="false">https://tympanus.net/codrops/?p=119101</guid>

					<description><![CDATA[Telling stories on some of the biggest canvases on the web, from Awwwards Site of the Year to the front door of Microsoft.]]></description>
		
		
		<enclosure url="https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2026/08/Microsoft-video.mp4?x57826" length="3318671" type="video/mp4" />
<enclosure url="https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2026/08/Lando-video.mp4?x57826" length="3921632" type="video/mp4" />
<enclosure url="https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2026/08/Trevor-noah-video-1-1.mp4?x57826" length="2962085" type="video/mp4" />
<enclosure url="https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2026/08/Trevor-noah-video-2.mp4?x57826" length="2496500" type="video/mp4" />
<enclosure url="https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2026/08/Steven-video-1.mp4?x57826" length="3229427" type="video/mp4" />
<enclosure url="https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2026/08/Steven-video-2.mp4?x57826" length="3859317" type="video/mp4" />
<enclosure url="https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2026/08/Manifesto-video-.mp4?x57826" length="3754611" type="video/mp4" />
<enclosure url="https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2026/08/Aether1-video.mp4?x57826" length="4017977" type="video/mp4" />

			</item>
		<item>
		<title>Inside HAOQI.DESIGN: Letting DOM and WebGL Share a Retro-Futurist Stage</title>
		<link>https://tympanus.net/codrops/2026/08/15/inside-haoqi-design-letting-dom-and-webgl-share-a-retro-futurist-stage/</link>
		
		<dc:creator><![CDATA[Haoqi]]></dc:creator>
		<pubDate>Sat, 15 Aug 2026 13:28:53 +0000</pubDate>
				<category><![CDATA[Articles]]></category>
		<category><![CDATA[case study]]></category>
		<category><![CDATA[portfolio]]></category>
		<category><![CDATA[Three.js]]></category>
		<category><![CDATA[WebGL]]></category>
		<guid isPermaLink="false">https://tympanus.net/codrops/?p=118395</guid>

					<description><![CDATA[A technical look at the making of HAOQI.DESIGN, exploring scroll sync, glass shaders, and the interplay of DOM, CSS, and WebGL in a retro-futurist portfolio.]]></description>
		
		
		<enclosure url="https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2026/08/1201.mp4?x57826" length="39740136" type="video/mp4" />
<enclosure url="https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2026/08/scroll_sync.mp4?x57826" length="617873" type="video/mp4" />
<enclosure url="https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2026/08/layer.mp4?x57826" length="7527321" type="video/mp4" />
<enclosure url="https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2026/08/grid-1.mp4?x57826" length="2473854" type="video/mp4" />
<enclosure url="https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2026/08/录屏2026-08-13-01.04.31.mp4?x57826" length="5404136" type="video/mp4" />
<enclosure url="https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2026/08/录屏2026-08-13-01.13.54.mp4?x57826" length="8000505" type="video/mp4" />
<enclosure url="https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2026/08/light_ring.mp4?x57826" length="4600920" type="video/mp4" />
<enclosure url="https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2026/08/beer.mp4?x57826" length="1537265" type="video/mp4" />
<enclosure url="https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2026/08/录屏2026-08-13-01.44.24.mp4?x57826" length="16564713" type="video/mp4" />

			</item>
		<item>
		<title>From Motion to Meaning: Denis Avramenko&#8217;s Approach to Interactive Design</title>
		<link>https://tympanus.net/codrops/2026/08/13/from-motion-to-meaning-denis-avramenkos-approach-to-interactive-design/</link>
		
		<dc:creator><![CDATA[Denis Avramenko]]></dc:creator>
		<pubDate>Thu, 13 Aug 2026 12:46:05 +0000</pubDate>
				<category><![CDATA[Articles]]></category>
		<category><![CDATA[Designer Spotlight]]></category>
		<guid isPermaLink="false">https://tympanus.net/codrops/?p=118381</guid>

					<description><![CDATA[A behind-the-scenes look at Denis Avramenko’s creative process, exploring his approach to motion, typography, interaction, and technology through a selection of digital projects.]]></description>
		
		
		<enclosure url="https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2026/08/be-1-1-2.mp4?x57826" length="1088559" type="video/mp4" />
<enclosure url="https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2026/08/dribbble-13mal-1_1-1.mp4?x57826" length="895646" type="video/mp4" />
<enclosure url="https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2026/08/be-7-1.mp4?x57826" length="1097873" type="video/mp4" />
<enclosure url="https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2026/08/be-1-1-1.mp4?x57826" length="699803" type="video/mp4" />
<enclosure url="https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2026/08/be-4-2.mp4?x57826" length="2206664" type="video/mp4" />
<enclosure url="https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2026/08/be-2-1-1.mp4?x57826" length="477606" type="video/mp4" />
<enclosure url="https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2026/08/be-6-1.mp4?x57826" length="1327618" type="video/mp4" />
<enclosure url="https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2026/08/1-2-1-6.mp4?x57826" length="460948" type="video/mp4" />
<enclosure url="https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2026/08/behance-stories-shot-1-1.mp4?x57826" length="2830270" type="video/mp4" />
<enclosure url="https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2026/08/dt_be_1-2.mp4?x57826" length="6555106" type="video/mp4" />

			</item>
		<item>
		<title>Creating an Interactive 3D Cluster with Three.js, TSL and Three Start</title>
		<link>https://tympanus.net/codrops/2026/08/12/creating-an-interactive-3d-cluster-with-three-js-tsl-and-three-start/</link>
		
		<dc:creator><![CDATA[Francesco Michelini]]></dc:creator>
		<pubDate>Wed, 12 Aug 2026 13:10:49 +0000</pubDate>
				<category><![CDATA[Tutorials]]></category>
		<category><![CDATA[icosahedron]]></category>
		<category><![CDATA[Three.js]]></category>
		<category><![CDATA[TSL]]></category>
		<category><![CDATA[WebGL]]></category>
		<category><![CDATA[webgpu]]></category>
		<guid isPermaLink="false">https://tympanus.net/codrops/?p=117948</guid>

					<description><![CDATA[A step-by-step tutorial on turning a simple icosahedron into a dynamic, interactive 3D cluster using Three.js, TSL, WebGPU, noise, interaction, and post-processing.]]></description>
		
		
		<enclosure url="https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2026/07/codrops-dark-cluster-tutorial-09-1.mp4?x57826" length="232958" type="video/mp4" />
<enclosure url="https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2026/07/codrops-dark-cluster-tutorial-10.mp4?x57826" length="1149060" type="video/mp4" />
<enclosure url="https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2026/07/codrops-dark-cluster-tutorial-12.mp4?x57826" length="1413543" type="video/mp4" />
<enclosure url="https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2026/07/codrops-dark-cluster-tutorial-14.mp4?x57826" length="2919568" type="video/mp4" />

			</item>
		<item>
		<title>Exploring Procedural Geometry with Three.js and WebGPU</title>
		<link>https://tympanus.net/codrops/2026/08/11/exploring-procedural-geometry-with-three-js-and-webgpu/</link>
		
		<dc:creator><![CDATA[Chiro Visuals]]></dc:creator>
		<pubDate>Tue, 11 Aug 2026 14:29:11 +0000</pubDate>
				<category><![CDATA[Tutorials]]></category>
		<category><![CDATA[3D]]></category>
		<category><![CDATA[Three.js]]></category>
		<category><![CDATA[TSL]]></category>
		<category><![CDATA[WebGL]]></category>
		<category><![CDATA[webgpu]]></category>
		<guid isPermaLink="false">https://tympanus.net/codrops/?p=118839</guid>

					<description><![CDATA[A deep dive into building a flexible Three.js Geometry Painter with WebGPU and TSL, from surface picking and procedural geometry to live controls, custom shaders, lighting, and post-processing.]]></description>
		
		
		
			</item>
		<item>
		<title>From Brand Systems to Cultural Worlds: Inside Antinomy and 27b</title>
		<link>https://tympanus.net/codrops/2026/08/10/from-brand-systems-to-cultural-worlds-inside-antinomy-and-27b/</link>
		
		<dc:creator><![CDATA[Antinomy]]></dc:creator>
		<pubDate>Mon, 10 Aug 2026 13:14:08 +0000</pubDate>
				<category><![CDATA[Articles]]></category>
		<category><![CDATA[Studio/Agency Spotlight]]></category>
		<guid isPermaLink="false">https://tympanus.net/codrops/?p=117651</guid>

					<description><![CDATA[A look inside two connected studios building brands across strategy, design, and experience, with the same instinct for clarity, culture, and edge.]]></description>
		
		
		<enclosure url="https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2026/07/260624_showreel.mp4?x57826" length="14622579" type="video/mp4" />
<enclosure url="https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2026/07/Maxi-a-03.mp4?x57826" length="3292282" type="video/mp4" />
<enclosure url="https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2026/07/tWdz1QtnMpB2yi7BNLam-2.mp4?x57826" length="3349539" type="video/mp4" />
<enclosure url="https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2026/07/41bd04cc-5323-4ddf-9a3e-3224b0c7f7e6-1.mp4?x57826" length="58206934" type="video/mp4" />
<enclosure url="https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2026/07/2026-03-13WebsiteHeader_12MB.mp4?x57826" length="11457903" type="video/mp4" />
<enclosure url="https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2026/07/Frame-7583-1-1.mp4?x57826" length="15339034" type="video/mp4" />
<enclosure url="https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2026/07/Haven-1ImmersiveWebGL-1-1.mp4?x57826" length="5929985" type="video/mp4" />
<enclosure url="https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2026/07/thermostat_motion_v005_heating_cooling.mp4?x57826" length="13626881" type="video/mp4" />
<enclosure url="https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2026/07/lighting_motion_v002_sliders.mp4?x57826" length="11098625" type="video/mp4" />
<enclosure url="https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2026/07/Waabi-4k-1.mp4?x57826" length="16954273" type="video/mp4" />
<enclosure url="https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2026/07/snappy-4-1.mp4?x57826" length="24604353" type="video/mp4" />
<enclosure url="https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2026/07/4-1.mp4?x57826" length="5063951" type="video/mp4" />
<enclosure url="https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2026/07/C014023.mp4?x57826" length="8825057" type="video/mp4" />
<enclosure url="https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2026/07/reel-1777984652224-2.mp4?x57826" length="2916881" type="video/mp4" />
<enclosure url="https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2026/07/reel-1777984908818-2.mp4?x57826" length="750551" type="video/mp4" />
<enclosure url="https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2026/07/reel-1785156198802.mp4?x57826" length="9419414" type="video/mp4" />
<enclosure url="https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2026/07/id_marga.mp4?x57826" length="10026321" type="video/mp4" />
<enclosure url="https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2026/07/id_elle_1.mp4?x57826" length="5929726" type="video/mp4" />
<enclosure url="https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2026/07/WB_ClockWork_Motion_Sound.mp4?x57826" length="302865" type="video/mp4" />
<enclosure url="https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2026/07/reel-1785152776513.mp4?x57826" length="2577920" type="video/mp4" />
<enclosure url="https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2026/07/neon_16.mp4?x57826" length="11535447" type="video/mp4" />
<enclosure url="https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2026/07/neon_1.mp4?x57826" length="144861" type="video/mp4" />
<enclosure url="https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2026/07/neon_c_1.mp4?x57826" length="2020507" type="video/mp4" />
<enclosure url="https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2026/07/neon_c_2.mp4?x57826" length="1754936" type="video/mp4" />
<enclosure url="https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2026/07/a24_18.mp4?x57826" length="5437477" type="video/mp4" />
<enclosure url="https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2026/07/a24_11.mp4?x57826" length="4037289" type="video/mp4" />
<enclosure url="https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2026/07/a24_9.mp4?x57826" length="3807029" type="video/mp4" />

			</item>
		<item>
		<title>Designing a Flexible Digital Archive for Chems.Studio&#8217;s Creative Practice</title>
		<link>https://tympanus.net/codrops/2026/08/08/designing-a-flexible-digital-archive-for-chems-studios-creative-practice/</link>
		
		<dc:creator><![CDATA[Nicolas Leuliet]]></dc:creator>
		<pubDate>Sat, 08 Aug 2026 15:13:31 +0000</pubDate>
				<category><![CDATA[Articles]]></category>
		<category><![CDATA[case study]]></category>
		<category><![CDATA[Webflow]]></category>
		<guid isPermaLink="false">https://tympanus.net/codrops/?p=117058</guid>

					<description><![CDATA[A film-led website for Chems Studio, bringing years of creative direction and moving image together through a quiet, flexible digital framework.]]></description>
		
		
		<enclosure url="https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2026/06/02.mp4?x57826" length="2806177" type="video/mp4" />
<enclosure url="https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2026/08/chems.mp4?x57826" length="4981662" type="video/mp4" />
<enclosure url="https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2026/06/06.mp4?x57826" length="6907885" type="video/mp4" />
<enclosure url="https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2026/06/05-1.mp4?x57826" length="17190997" type="video/mp4" />
<enclosure url="https://codrops-1f606.kxcdn.com/codrops/wp-content/uploads/2026/06/01.mp4?x57826" length="21537591" type="video/mp4" />

			</item>
	</channel>
</rss>

<!--
Performance optimized by W3 Total Cache. Learn more: https://www.boldgrid.com/w3-total-cache/?utm_source=w3tc&utm_medium=footer_comment&utm_campaign=free_plugin

Object Caching 61/81 objects using Memcached
Page Caching using Disk: Enhanced (SSL caching disabled) 
Content Delivery Network via codrops-1f606.kxcdn.com
Minified using Disk

Served from: tympanus.net @ 2026-08-21 12:57:14 by W3 Total Cache
-->