Web Standards

Media queries range syntax. @shadeed9 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/range-…

Design token naming conventions: a practical guide. @StuRobson 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 alwaystwisted.com/articles/desig…

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

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/blog/the-web-i…

Scroll-driven animations. Josh 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 joshwcomeau.com/animation/scro…

Automate the browser from the terminal with Chrome DevTools MCP CLI. @nucliweb 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/chrome-devt…

The end of responsive images. Mat Marquis 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-end-o…

Your options for preloading images with JavaScript. @amacarthur 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/preloadi…

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

Highlights from Git 2.54. @ttaylorr_b 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-source/gi…

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.org/en-US/docs/Moz…

Fully local code embeds. @hovhaDovah built a web component that renders isolated code sandboxes using iframe srcdoc, without third-party services like CodePen or CodeSandbox. #html #js aleksandrhovhannisyan.com/blog/local-cod…

Introducing masonry-gridlanes-wc: a native-first masonry web component. @schalkneethling 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/posts/introduc…

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.com/en-US/survey/s…

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.com

SVG filters guide: getting started with the basics. @anatudor 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/blog/svg-filte…

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/2026/progressi…

Inverted themes with light-dark(). @davatron5000 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/04/invert…

Under the hood of MDN’s new frontend. Leo McArdle 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.org/en-US/blog/mdn…

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/release-notes/…