WebKit Features in Safari 26.0 — With the release of macOS 26, iOS 26, et al. comes a major release of Safari. This is a bumper look at what’s new in the now-available Safari 26. Features landing include anchor positioning, scroll-driven animations, the <model> element (for embedding 3D models onto pages), the CSS progress() function, SVG icon support, and now "every site can be a web app on iOS and iPadOS."

WebKit

AI Code Reviews Meet CLI Coding Agents — CodeRabbit CLI brings instant code reviews directly to your terminal, integrating with Claude Code, Cursor CLI, and other AI agents. While they generate code, CodeRabbit ensures it's production-ready - catching bugs, security issues, and hallucinations before they hit your codebase.

CodeRabbit sponsor

What Can We Actually Do With corner-shape? — It's currently only supported in Chrome/Edge, but this property enables us to style corners, beyond what we can do with the existing border-radius property. Here’s a look at how, complete with several neat demos. “So, corner-shape is actually a helluva lot of fun. It certainly has more uses than I expected”.

Daniel Schwarz

Follow-the-Leader Pattern with CSS Anchor Positioning — Una shares a couple of cool (Chromium only) demos for a CSS-based pattern which uses a ‘follower’ element that will dynamically update its anchor based on user input/state changes. A neat little demo of what’s possible with anchor positioning.

Una Kravets

You Don't Need Animations — A good primer on when (and when not) to add animations to your user interfaces, along with pointers on how to do so effectively and with purpose.

Emil Kowalski

An Accessible Guide to WCAG 3.3.8: Authentication Without Frustration — Highlights how the act of logging in can often be tough for users with cognitive disabilities, and then looks at the guidance available to us.

Ramona Schwering

Accelerate Your Path from Mid-Level to Senior Developer — Get access to over 250 frontend and fullstack engineering courses with Frontend Masters — $100 off yearly membership.

Frontend Masters sponsor

Subgrid: How to Line Up Elements to Your Heart’s Content — Saron notes that although subgrid is not new, the recent State of CSS survey results revealed how it’s still confusing to people — as such this post shares a way to understand things by way of a component in need of a subgrid.

Saron Yitbarek (WebKit)

Replace Your Animated GIFs with SVGs — Yes, there’s a few gotchas to keep in mind, but John shares the benefits of animated SVGs, including dramatically smaller file sizes, their infinite scalability, and some media query capabilities.

John Rhea

Breakpoint Columns, Five Ways. Which Do You Like? — Chris looks at the handful of ways in which we can approach switching up how columns display depending on a breakpoint, such as via media queries, if() functions, etc.

Chris Coyier

🦋 BlueSky Likes: Flexible Components for Displaying Bluesky Likes — Live demo here. Includes two custom element components: bluesky-likes and bluesky-likers. One displays the number of likes and the other displays a group of avatars of those who liked a post. — P.S. You can follow us here.

Lea Verou

Ready to Increase Your Conversions? Get Started with Free Trials — Free Trials are now available through Clerk Billing. Stop building trial logic, cancellation flows, and upgrade paths.

Clerk sponsor

Volume: A 3D OKLCH Color Palette Creator — As explained on the intro page, this tool, “turns color selection from a flat swatch-hunt into a sculptural, 3D design journey”. Includes a visual tour to help you get started. Interesting approach!

Volume

Kirby 5.1.0 Released — The latest version of a popular PHP-based CMS. Adds new navigation options, support for nested dialogs, UI improvements, changes to language detection, and more.

Kirby

Brutalita Sans: An Experimental Font and Font Editor — An interesting project that lets you download the original font, or you can edit each individual character right on the page to create your own custom version of the same typeface.

Javier Bórquez

React Bits: 100+ Creative, Animated React Components — If you want a bit of visual pizzazz in your project, this is for you. The components span from a variety of text effects to general animations, a ‘chroma grid’, bouncing cards, distortions, and more. GitHub repo.

David Has

Tooooools: Free Minimalist and Lo-fi Effects for Image and Video Processing — Upload an image and choose from 13 effects (dots, patterns, distort, dithering, bevel, etc.), each of which can be customized dynamically on the page. Export is in PNG format.

Daniil Sukhovskoy