Browsers treat big sites differently. Den Odell shows how Safari and Firefox ship thousands of lines of site-specific fixes, while Chrome’s dominance forces minority browsers to compensate, echoing the IE era in reverse. #browser #interop denodell.com/blog/br...

The HTML Sanitizer API. Ahmad Alfy explains the new browser-native API for XSS-safe HTML. setHTML and parseHTML always strip dangerous content, while setHTMLUnsafe variants follow your allow-list or block-list configuration. #security #html alfy.blog/2026/05/07...

Soon we can finally banish JavaScript to the ShadowRealm. @wil.to walks through the TC39 proposal for isolated execution contexts with pristine globals, perfect for sandboxing third-party scripts. Still at Stage 2.7. #js #ecmascript css-tricks.com/soon-...

WebKit features for Safari 26.5. Jen Simmons introduces the :open pseudo-class, element-scoped random(), color-interpolation for SVG gradients, ToggleEvent.source for popovers, the new Origin API, and 63 bug fixes. #safari #browser webkit.org/blog/1793...

How to control infinite CSS animations. In part 1 of 2, @css-only.dev shows how to speed up, slow down, and reverse infinite CSS animations on demand using animation-composition, CSS variables, and abs() and sign() functions. #css #animation frontendmasters.com/...

From React to native web with nanotags: a migration that saved 100 KB. Pavel Grinchenko replaced React and Ark UI with native Web Components and a 2.5 KB wrapper, nanotags, cutting 100 KB of JavaScript. #webcomponents #react evilmartians.com/chr...

Using safe-area-inset to build mobile-safe layouts. The @polypane.app blog covers env(safe-area-inset-*), viewport-fit=cover, calc() for extra spacing, and safe-area-max-inset-* that stays stable when the address bar hides. #css #layout polypane.app/blog/us...

What’s new in Chrome 148. CSS name-only container queries, at-rule() in @​supports, lazy loading for video and audio, the Prompt API for on-device AI, Web Serial on Android, and Web Authentication Immediate UI. #chrome #browser developer.chrome.com...

Media queries range syntax. Ahmad Shadeed shows how min-width and max-width create overlap bugs at identical breakpoints. The fix: CSS range syntax with operators like <=, >=, and >, supported since March 2023. #css #layout ishadeed.com/article...

Design token naming conventions: a practical guide. Stuart Robson breaks down how to build token names that scale: three tiers (primitives, semantic, component), five naming conventions, and principles like consistency over perfection. #design #component www.alwaystwisted.co...

SVG from scratch. Carmen Ansio presents SVG not as a graphics format but as a DOM where every shape is an element, every attribute a style, that could be selected with CSS, animated with transitions, and targeted with JavaScript. #svg #animation www.carmenansio.com/...

The web is fun again: first experiments with HTML in <canvas>. Amit Sheen explores Chrome’s experimental Canvas Draw Element API that renders HTML into <canvas> while keeping semantics, with pixel effects, mouse interaction, and WebGL shaders. #html #api frontendmasters.com/...

Scroll-driven animations. Josh W. Comeau explains CSS animation-timeline, which maps keyframes over scroll distance instead of duration, with ranges, scroll progress timelines, and linked timelines. Around 85% browser support. #scroll #animation www.joshwcomeau.com/...

Automate the browser from the terminal with Chrome DevTools MCP CLI. Joan León tours a CLI that controls Chrome through shell commands, with a persistent daemon for navigation, screenshots, Lighthouse audits, and Core Web Vitals tracing. #devtools #tools joanleon.dev/en/chro...

The end of responsive images. @wil.to revisits a decade of sizes headaches and shows how sizes="auto" with loading="lazy" finally hands that work back to the browser. Supported in Firefox, Safari, and Chrome. #html #performance piccalil.li/blog/the...

Your options for preloading images with JavaScript. Alex MacArthur compares five approaches from new Image() to the Cache API, breaking down the trade-offs of each for preventing image loading lag. #js #performance macarthur.me/posts/p...

Playwright accessibility testing: what axe and Lighthouse miss. David Mello explains that automated tools catch only 30-40% of WCAG violations and shares Playwright patterns for testing what scanners can’t detect. #a11y #testing www.davidmello.com/s...

Highlights from Git 2.54. Taylor Blau covers git history reword for editing commit messages in place without touching the working tree, and git history split for interactively splitting a commit into two by selecting hunks. #git #tools github.blog/open-sou...

Firefox 150 release notes for developers. The release adds sizes="auto" for images, color-mix() with multiple colors, media pseudo-classes for <audio> and <video>, animation range properties, and ariaNotify(). #firefox #browser developer.mozilla.or...

Fully local code embeds. Aleksandr built a web component that renders isolated code sandboxes using iframe srcdoc, without third-party services like CodePen or CodeSandbox. #html #js www.aleksandrhovhann...

Introducing masonry-gridlanes-wc: a native-first masonry web component. Schalk Neethling built a web component for masonry layouts based on display: grid-lanes from CSS Grid Level 3, with a JS fallback when needed. #webcomponents #layout schalkneethling.com/...

State of AI 2026. Devographics launched a new survey on how developers use AI tools, models, and coding assistants in their daily workflows. #ai #survey survey.devographics....

Modern CSS feature support for shadow DOM. Adobe Spectrum Web Engineering tracks CSS features like :has(), @​scope, and anchor positioning across the shadow DOM, with browser test results and spec issue links. #css #webcomponents shadow-dom-css.adobe...

SVG filters guide: getting started with the basics. Ana Tudor explains how to set up SVG filters, chain primitives, configure filter regions, and handle color interpolation for consistent cross-browser results. #svg #filter frontendmasters.com/...

Progressive web components. Ariel Salminen introduces Elena, a 2.6 kB library for building web components that prioritize HTML and CSS, then hydrate with JavaScript. #webcomponents #js arielsalminen.com/20...

Inverted themes with light-dark(). Dave Rupert shows how to combine the CSS light-dark() function with container style queries to flip elements between color schemes without duplicating variables. #css #color daverupert.com/2026/...

Under the hood of MDN’s new frontend. @leo.mca.is explains how MDN replaced React with web components and Lit, using server components for static content and lazy-loading interactive islands. #mdn #webcomponents developer.mozilla.or...

What’s new in Chrome 147. Element-scoped view transitions, CSS contrast-color(), border-shape for non-rectangular borders, Math.sumPrecise, CSSPseudoElement interface, local network access restrictions, and Rust-based XML parsing. #chrome #browser developer.chrome.com...

Getting your article shared: tips from ten years of newsletter curation. @spaceninja.com’s practical guide: add OG tags, use a sharing image, write clear titles, include a blurb, fix canonical URLs, and date your posts. #html #learn cloudfour.com/thinks...

What is CSS containment and how can I use it? Harry Roberts covers each contain value, the content and strict shorthands, and content-visibility. Includes a real OpenTable case where containment cut layout time sixfold. #css #performance csswizardry.com/2026...

The great CSS expansion. Pavel Laptev tours CSS features replacing JavaScript libraries like Floating UI, Radix, GSAP, and React Select, cutting up to 322 kB of JavaScript. #css #performance blog.gitbutler.com/t...

Squarespace and web standards: how we helped bring HTML video and audio lazy loading to today’s browsers. Scott Jehl describes how the team proposed loading="lazy" for video and audio, making it an official web standard. #html #performance engineering.squaresp...

Native JSON modules are finally real. Matt Smith explains how import attributes let you load JSON directly in browsers and runtimes with import data from 'data.json' with { type: 'json' }, no bundler needed. #json #js allthingssmitty.com/...

Form-associated custom elements in practice. Rob Levin retrofits AgnosticUI with ElementInternals, covering two validation strategies and practical patterns for input, radio, and combobox components in Shadow DOM. #webcomponents #html frontendmasters.com/...

CSS is DOOMed: rendering DOOM in 3D with CSS. Niels Leenheer renders the classic game entirely with CSS transforms and divs in 3D space, using trig functions, @​property, and SVG filters. #css #3d nielsleenheer.com/ar...

The Layout Maestro, a practical CSS course on building web layouts. Ahmad Shadeed’s course covers Flexbox, Grid, container queries, and :has() through visual lessons and interactive demos. #css #learn thelayoutmaestro.com

Under the hood: a closer look at the CSS architecture behind the redesign. Brecht De Ruyte covers cascade layers, design tokens, light-dark(), container queries, and progressive enhancement via @​supports. #css #design utilitybend.com/blog...

WebKit features for Safari 26.4. Jen Simmons introduces new features, including grid lanes for masonry layouts, WebTransport for low-latency communication, and the Keyboard Lock API. Plus name-only container queries, threaded scroll-driven animations, and more. webkit.org/blog/1786...

Firefox 149 release notes for developers. Popover hint value, CloseWatcher, shape-outside xywh(), vertical-align as a shorthand, optional @​container conditions, and captureStream(). #firefox #browser developer.mozilla.or...

CSSkit, a high-performance CSS toolchain written in Rust. Keith Cirkel’s project combines parsing, minification, linting, formatting, and LSP integration into one zero-config tool inspired by oxc. #css #tools https://csskit.rs

Folded corner with CSS. Kitty Giraudel breaks down a hover effect where an image corner folds over using clip-path, a white triangle, and shadow elements. Plus CSS transitions for smooth animation. #css #animation kittygiraudel.com/20...

Abusing customizable selects. Patrick Brosset builds three creative demos with the new <select>: a curved folder stack, a fanned card deck with anchor positioning, and a radial emoji picker with CSS trigonometric functions. #css #html css-tricks.com/abusi...

Temporal: the 9-year journey to fix time in JavaScript. Jason Williams traces the path from proposal to Stage 4, covering immutable objects, timezone support, nanosecond precision, and a shared Rust implementation across engines. #ecmascript #temporal bloomberg.github.io/...

Introducing view-transitions-mock, a non-visual polyfill for same-document view transitions. Bramus built a spec-compliant JavaScript implementation of the View Transition API that works across all browsers. #viewtransition #polyfill www.bram.us/2026/03/...

Un-Sass’ing my CSS: native CSS nesting. Stuart Robson walks through how native CSS nesting works in modern browsers and compares it to Sass: specificity, the & symbol, practical differences, and component examples, including alerts, cards, and search forms. #css #learn www.alwaystwisted.co...

You don’t know HTML tables. @paceaux.com goes beyond the basics, exploring table vocabulary, the Table Object Model API, header cell semantics with scope and headers attributes, and practical patterns for building accessible, well-structured tables. #html #a11y blog.frankmtaylor.co...

What’s new in Chrome 146. Scroll-triggered CSS animations, Sanitizer API for XSS protection, WebGPU compatibility mode, Iterator.concat, text scaling meta element, and improved LCP metrics. #chrome #browser developer.chrome.com...

Everything you never wanted to know about visually-hidden. @dbushell.com traces the history of the pattern, tests a minimal CSS approach, and explains why the platform still lacks a native alternative. #a11y #css dbushell.com/2026/02...

SVGs on the web: performance comparison based on how you load them. Joan León compares inline <svg>, <img>, <object>, CSS background, and sprites with <use> for their caching, request count, and rendering trade-offs. #svg #performance joanleon.dev/en/svg-...

The new CodePen 2.0 is now in public beta. Pens now have their own file system with folders, a new block-based build process without config, real-time collaboration by invite, an omnibar for quick access to files and commands, and privacy controls. #tools #css https://codepen.io/beta