12 Modern CSS One-Line Upgrades — Here’s a dozen CSS properties that are well worth knowing — these one-line upgrades will help reduce technical debt, remove unnecessary lines of JavaScript, and score some easy wins for user experience, too. Think things like object-fit, scroll-margin, accent-color, etc.

Stephanie Eckles

[Guide] Debugging Your Next.js App With Sentry — Get all the basics to monitoring and debugging your Next.js app with Sentry in this 7-part video series. You’ll learn how to instrument your app with Sentry, how to identify a few specific issues, and follow errors from the client to the server.

Sentry sponsor

A Practical Introduction to Scroll-Driven Animations with CSS scroll() and view() — Shows us how, with just CSS, we can add scroll animations that toggle shadows on navbars, reveal images, add so-called 'scrolly-telling', link up carousel elements, and more.

Adam Argyle

AI for Web Devs — Austin has just published the last post in this eight part series on using AI in web development, covering prompt engineerings, security, deployment, and more.

Austin Gil

Try a Lightning-Fast Pairing Tool Built with You in Mind — Tuple will change the way you think about pair programming. Try it with your team free for 14 days, no card required.

Tuple sponsor

Learn the :has() Selector by Example — Five practical examples of how to use this selector. There’s a video running through things too if you’d rather that.

Mojtaba Seyedi

Fading Content using Transparent Gradient in CSS — A nice effect, and one that’s easily realised.

Amit Merchant

Better Form UX with the field-sizing Property — A look at how the field-sizing CSS property could improve web form user experience.

Stephanie Stimac

Design Better Pagination — Andrew shares some pagination UI best practices along with some considerations for more complex needs. Lots of visuals here to help things along.

Andrew Coyle

Disable Browser Caching with Meta HTML Tags — Worth knowing (or at least bookmarking).

Cristian Sulea

✨ sparkly-text: A Small Web Component for Making Text Sparkle — A cute effect that uses animated SVG under the hood. You can see a few examples in this post.

Stefan Judis

Design Systems Database: A Database of Best-in-Class Design Systems, Organized and Sorted by Components and Directories — Useful for studying the public design systems of well-known technical teams (Adobe, GitHub, MailChimp, Shopify, etc.), divided into systems, directories, components, and blueprints. Handy stuff.

Ilya Greben

Generate and Render Dynamic JSON-Based Forms Right in Your App — Self-host SurveyJS UI libraries to design and style forms with a no-code builder that features CSS theme editor and GUI for conditional rules.

SurveyJS sponsor

SVG Filter Maker: A GUI To Interactively Build SVG Filters — Not to be confused with CSS filters, this is for building the much more complex SVG filters using the <filter> element and one or more of the many filter primitives.

Christopher Kirk-Nielsen

Wooden Toggles — I’m sharing this HTML and CSS CodePen demo just for the skeuomorphic memories it evokes of the texture, depth and ‘rich Corinthian leather’ found in the early days of iOS.

Nicolas Jesenberger

Typeculator: A Different Approach to Generating Type Scales — Based on something called the “Golden Thread” technique, which helps overcome problems like fractional values, challenges with multiple typefaces, etc.

Alex Paul

worker-timers: setInterval/setTimeout But for Unfocused Windows — When a tab loses focus, any timers used within can be throttled. One solution is to use a Web Worker instead.

Christoph Guttandin

CSS 3D Clouds — This striking demo (from a decade ago) has been doing the rounds this week — it set out to create 3D-like clouds using CSS, transforms, and a touch of JavaScript. The approach to create such a thing now might be a little different, but this result remains good. You can make fluffy clouds, stormy ones, or even go with an over-the-top Michael Bay approach. Repo here, and there’s a tutorial, if you want to look back at how it was put together.

Jaume Sánchez