Uncode Creative and WooCommerce Theme
Uncode is a pixel-perfect creative WordPress Theme for creating stunning websites.
The Collective
Hand-picked interesting links for
web creators, updated daily.
Prefer a weekly digest?
Build a Product Card with Tailwind CSS
Discover intermediate and advanced styling techniques using Tailwind CSS and craft a fully responsive, professional product card for a web store in this Scrimba course. Codrops readers get 20% off Pro plans!
GSAP ScrollTrigger Visualizer
A useful tool for GSAP users to better understand ScrollTrigger behavior.
CSS Form Control Styling Level 1
An unofficial draft for CSS Form Control Styling, defining new ways to style form controls with standardized pseudo-elements and properties.
Circle
Leonel Ngoya introduces Circle, an open-source project management template inspired by Linear. Built with Next.js and shadcn/ui, it helps track issues, projects, and teams.
prompt-kit
Customizable components for building AI interfaces, including features like prompt inputs and messaging elements.
My experiments with WASM and OpenGL
Uddeshya experiments with WASM and OpenGL, tackling performance, rendering challenges, and debugging in an attempt to render 1M spheres at 60 FPS.
View Transitions Applied: Dealing with the Snapshot Containing Block
Bramus explores View Transitions, highlighting coordinate space issues and solutions for smoother animations in web development.
Why we ditched Next.js and never looked back
Northflank discusses their switch from Next.js to a custom SSR solution, leading to faster load times, improved SEO, and better control over their tech stack.
In Defense of Text Labels
Christopher Butler makes the case for the importance of text labels in UX design, highlighting how they improve clarity and reduce cognitive load compared to relying solely on icons.
User-Interface Elements: Glossary
This glossary provides quick definitions for key user-interface elements and controls commonly used in UX research and design.
Hyper-personalization: a practical UX guide
The article discusses hyper-personalization in UX design, focusing on its evolution, key components, and the role of data in creating tailored, engaging user experiences.
three-pinata
Dan Greenheck announces the official release of Three Piñata, an open-source Three.js library for slicing, smashing, and exploding 3D meshes in real time. Check it out on GitHub here and npm here.
Chrome on Android edge-to-edge migration guide
Bramus explains Chrome 135's new edge-to-edge behavior on Android, detailing how websites can adapt for full-screen display and handle safe area insets.
Is the button focusable?
Manuel Matuzović tests different HTML and CSS methods to hide a button, exploring which remain focusable and exposing potential accessibility issues.
Scroll Buddy
A fun little experiment adds an animated stick figure that walks along the scrollbar as users scroll, with plans for more characters like a skateboarder or climber.
What is TypeScript? An overview for JavaScript programmers
Dr. Axel Rauschmayer gives an overview of TypeScript for JavaScript developers, covering its syntax, execution, transpilation, and integration with modern tools.
Three.js Tamagotchi Challenge
The Tamagotchi Challenge is complete with 34 creative submissions! Explore interactive demos, vote for your favorites, and see results on March 7.
ShaderGPT™
ShaderGPT™ is an AI experiment that generates GLSL shaders from text prompts. Built with Vercel AI SDK, it turns descriptions into real-time visuals. More details here.
Particles morphing
Pavel Mazhuga experiments with Three.js TSL, using compute shaders and curl noise to morph particles into shapes. Source here.
In praise of off-screen menus
Jason Bradberry challenges the conventional wisdom that visible menus are always best, arguing that off-screen menus can enhance focus, aesthetics, and user experience in the right context.
Distributed Systems Programming Has Stalled
Shadaj Laddad examines the stagnation in distributed systems programming, arguing for a native model that improves control, fault tolerance, and scalability.
GLSL tricks for tweet shaders
Xor shares compact GLSL shader tricks: fluid dynamics with sine waves, layered effects, and polar-log coordinates for natural visuals.
How Core Git Developers Configure Git
Scott Chacon explores Git config settings that even core Git developers tweak, highlighting key changes that improve usability, efficiency, and defaults.
upfetch
A lightweight, type-safe fetch client builder with schema validation, automatic parsing, and smart defaults for simpler API requests.
Why I Like Designing in the Browser
Tyler Sticka on designing in the browser with HTML/CSS for real-time feedback, fluid layouts, and modern CSS—while still valuing design tools.
Building a “shoutout” component in plain HTML/CSS/JavaScript
Christian Heilmann creates a 'shoutout' overlay in plain HTML, CSS, and JS to mark key moments in videos for easier post-production editing.
Better Anchor Positioning with position-area
James Stuckey Weber explores position-area, a powerful shorthand for CSS Anchor Positioning that simplifies placement while preventing overflow issues.
The web on mobile (a response)
A response to Jeremy’s critique: mobile web UX issues aren’t just on developers—business pressures and browser limits worsen the experience.
Clean Code vs. Philosophy of Software Design: Two Masters Debate
In their Sept 2024-Feb 2025 discussions, Martin and Ousterhout debate method length, comments, and TDD, revealing opposing views on code design.
It’s still worth blogging in the age of AI
Giles Thomas argues blogging retains value for learning, portfolio-building, and occasional connections, even as AI tools increasingly mediate content discovery.
Claude 3.7 Sonnet and Claude Code
Anthropic introduces Claude 3.7 Sonnet, a hybrid reasoning model for rapid or deep thinking, along with Claude Code, an AI-powered agentic coding tool.
And the river runs
Frank Reitberger’s third WebGPU experiment uses TSL and Three.js to create a real-time water simulation with shaders and procedural rendering.
Hexapod Simulator
An interactive 3D hexapod simulation using Three.js for visualization, inverse kinematics for movement, and smooth spline-based animations.
Solved by StyleObserver: Element.matchContainer()
Martin Winkler's match-container polyfill brings Element.matchContainer() to JavaScript, enabling real-time detection of Container Query changes using StyleObserver.
This page is under construction
A passionate call from Sophie Koonin to reclaim the web’s creativity—build personal sites, embrace individuality, and break free from corporate platforms.
Lessons from an AI-assisted site migration
Tom Bennet shares lessons from migrating Tom’s Carnivores to Astro, where AI streamlined repetitive tasks but struggled with complex coding challenges.
Vietnamese Graphic Design
A growing archive of Vietnamese graphic design, aiming to document and celebrate its history despite limited accessible resources.
Running Pong in 240 Browser Tabs
Nolen Royalty hacks Pong into 240 browser tabs, syncing movement across favicons and canvases while solving throttling and tab communication challenges.
An Emoji Naming Convention
Adam Argyle proposes using emojis in CSS naming for clarity but questions its practicality for readability and accessibility.
Liquid Metal by Paper
Liquid Metal is an open-source tool by Paper that lets you transform your logo into a liquid metal effect, inspired by Apple's design.
Record
Addy Osmani launches Record, a free, open-source browser-based screen recorder with camera support, teleprompter, and MP4 export—no installs needed!
The World’s Largest Search Doesn’t Want You to Search
Ted Gioia argues that Google has shifted from being a true search engine to prioritizing AI content, user retention, and ad revenue at the expense of search quality and trust.
Mastra
A TypeScript AI framework with agents, RAG, workflows, and integrations, enabling fast AI app development with LLM model routing.
