The Collective #912: Disfigure Posture Editor, View Transitions Applied, Dithering Shader
Your weekly digest of dev & design links
Codrops Publication
May 20, 2025
Olá, frontend friends! 👋
Here’s a fresh roundup of the latest frontend news, links, and resources to inspire and inform you. Whether you're looking for new ideas or just something interesting, we hope you'll discover something exciting in this edition!
Happy exploring! đź’™
P.S. We've been hosting Codrops with Liquid Web for almost a decade now—super reliable and solid support. Highly recommended.
From our sponsor
A fresh, designer-friendly way to build without writing a single line of code.
Bolt.new is the AI-powered agent that enables anyone to become a developer.
GSAP named Andres Briganti its Website of the Week—a fast, focused, and brutally intentional experience powered by Observer, SplitText, and React.
gsap / web-trends
Fabien Sanglard restores his dream 90s IBM PC in a deep, nostalgic series covering hardware, DOS setup, peripherals, and classic PC gaming.
article / hardware / nostalgia / retro
A WIP library for rigging boneless, morphless 3D models using Three.js TSL. Includes demos and proof-of-concept videos.
3d / three-js / tsl
A terminal-based microblogging platform accessed via SSH — no browser, just pure text, hashtags, and eets.
social-media / ssh / terminal
Hyvector is a fast, browser-based SVG editor built for complex images. Now in first release, feedback is welcome via the issue tracker.
svg / tool
A tutorial exploring two ways to animate border-radius with View Transitions in CSS — one using custom animations, the other using CSS transitions.
css / tutorial
A tutorial on building a ride wait-time sorter using a free API, Alpine.js, and Gemini-assisted styling
alpinejs / api / javascript / tutorial
A fast, dependency-free DOM capture library that converts HTML elements to SVG or images with full style, font, and pseudo-element support.
library / svg / tool
Three.js loaders for GeoJSON and WKT shapes with support for flat/extruded meshes, precise transforms, and line geometry.
3d / data-visualization / geojson / three-js
A dithering shader demo using React Three Fiber, with bloom, grayscale, pixelation, and live controls. Source code here.
glsl / three-js
A modular CSS library bringing the aesthetics of terminal UIs to the web.
css / library
A realtime procedural jellyfish demo using Three.js and WebGPU. Fake lighting, GPU physics, and shaders. View the source code here.
three-js / tsl / webgpu
From our sponsor
Small Budget, Big Impact: Outsmart Your Larger Competitors
Being outspent doesn't mean being outmarketed. Our latest resource showcases 15 small businesses that leveraged creativity instead of cash to achieve remarkable marketing wins against much larger competitors.
Proven techniques for standing out in crowded markets without massive budgets
Tactical approaches that turn resource constraints into competitive advantages
Real-world examples of small teams creating outsized market impact
Ready to level the playing field? Download now to discover the exact frameworks these brands used to compete and win.
A satirical sci-fi tale where machines create humans as an experiment, only to be amazed—and alarmed—by their emotional resilience.
ai / article / satire
Jen Simmons shows how contrast-color() in CSS auto-picks black or white text for better contrast, easing styling but not replacing a11y checks.
accessibility / article / css
A site for discovering, comparing, and staying updated on programming languages with news, code examples, and trends.
programming-language
GSAP shares 10 standout entries from the GSAP x Webflow animation challenge, showcasing creative and technical excellence in playful demos.
gsap
This article critiques “hyper-typing” in TypeScript—overly complex types for perfect safety—arguing simpler types often offer better DX.
opinion / typescript
A lightweight JS/TS UI library for building fast, reactive interfaces without a virtual DOM.
javascript / library / typescript
Josh W. Comeau explains why height: 50% often fails in CSS and how to make percentage heights work with knowable parent heights, Grid, or Flexbox.
css / tutorial
From our sponsor
Fact-based news without bias awaits. Make 1440 your choice today.
Overwhelmed by biased news? Cut through the clutter and get straight facts with your daily 1440 digest. From politics to sports, join millions who start their day informed.
Codrops is proudly sponsored by KeyCDN, the high performance content delivery network that has been built for the future.