|
|
![]() |
Firefox 144 Released: All Major Browsers Now Support View Transitions — A notable release as the View Transitions API is finally supported (as in all other major browsers). Other features include support for the Firefox |
💡 MDN has also just published a beginner-friendly guide to view transitions in CSS for anyone new to the concept. |
![]() New Course: Professional AI Setup with Cursor & Claude Code — Boost your coding productivity with AI-assisted tools and agents. Learn how to use Cursor and Claude Code for precise inline edits, quick refactors, and automated background tasks that accelerate your workflow. Frontend Masters sponsor |
CSS Grid: A Helpful Mental Model and the Power of Grid Lines — Saron shares a mental model for helping us best understand CSS Grid, attempting to demystify things via a container-first approach. There are snippets and examples to illustrate just how grid lines can help with precise element placement. Saron Yitbarek (WebKit) |
🔢 Interop Feature Ranking — A new site from the Firefox team for sharing which of the future Interop features you care about most. Log in with GitHub then drag the various web platform features around to your liking to influence their future development. Firefox |
|
📙 Articles, Opinions & Tutorials |
![]() |
Modern CSS Round-Out Tabs — Chris revisits an old tabular user interface pattern (as seen above) and updates it with modern CSS thanks to the Chris Coyier |
Catch Frontend Errors Before Your Users Do [Free Workshop] — Learn to use Web Vitals, distributed tracing, and AI debugging to keep your app fast, stable, and ready for the rush. Sentry sponsor |
The Thing About Andy Clarke |
The New Amit Merchant |
CSS Matthias Ott |
The Killer Feature of Web Components — Dave sings the praises of Custom Elements Manifest (CEM), a feature he notes as being somewhat overlooked, but one that’s a powerful community-driven JSON format for surfacing all sorts of information about your component APIs. Dave Rupert |
Animating WebGL Shaders with GSAP: Ripples, Reveals, & Dynamic Blur Effects
|
How to Add Fast, Client-Side Search to Astro Static Sites
|
Implementing Dark Mode Toggle Without JavaScript
|
🧰 Tools, Code & Resources |
![]() |
Mirrow: A DSL for Creating and Animating SVGs — The idea is that instead of SVGs being static assets, you can make them ‘living’ documents by providing a more code-like format for defining them. Check out the playground to interact with some Mirror code directly and see what you can create. Mirrow Team |
Tiger Lake: Real-Time Data Architecture Built for Modern Apps — Unify Postgres and your lakehouse. No pipelines, no lag—just real-time data and full context. TigerData sponsor |
Triplex: A Visual Workspace for Building React Three Fiber Components — Originally a commercial tool for visually laying out components in 3D scenes rendered with React Three Fiber, Triplex has gone open source and joined the Poimandres Collective (responsible for projects like Three Fiber, Jotai, and Zustand). Its scope has also increased with a VS Code extension and support for regular React DOM elements and components. Mike Douges and Pmndrs |
![]() |
ogImage.click: A Free Open Graph Image Generator — Choose from different templates for the platform you want the image to display on. You can also use an API to generate the images on the fly via JSON or cURL. Fady Mak |
Dev Tools: 20+ Privacy-First Productivity Tools for Developers — Similar to other such resources. This one uniquely features keyboard shortcuts to switch tools/pages and includes tools for text, encoding/conversion, and generators, among others. Hitarth shah |
📊 Make Graph: Create Beautiful Charts and Graphs Online — A nicely designed tool with 10 chart types (bar, line, pie, scatter, heatmap, etc.), 10+ themes, prebuilt templates, and features for making the charts more accessible with visual pattern textures. Make Graph |
📄 EmbedPDF: A PDF Viewer That Integrates with Any JavaScript Project — No dependencies, supports any framework, and has features like themes, annotations, search, smooth scrolling, etc. Docs and a live demo here. EmbedPDF |
|
🎁 And a Bun Bonus |
![]() |
Bun 1.3: The Alternative Full-Stack JS Runtime — The performance-focused JavaScriptCore-powered runtime gets a big upgrade making it more of a ‘full-stack runtime’ including a dev server with hot reloading (yes, you can 'run' HTML files with Bun now — as above), the ability to scaffold React projects (with Tailwind and Shadcn!) out of the box, and isolated package installs by default. There’s a lot to like in here for front-end developers. The Bun Team |