“The Great CSS Expansion” on turquoise background. Large purple CSS logo tilted over a small yellow JS logo. GitButler logo in the top left.
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...
“How We Helped Bring HTML Video & Audio Lazy Loading to Today’s Browsers” next to HTML Living Standard page dated 23 March 2026 with the loading attribute spec.
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” title, author photo, code snippets with JSON and CSS import attributes. Matt Smith, Modern Web Engineering.
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” title, Frontend Masters logo, a contact form with custom element tags like ag-input and ag-button.
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/...
DOOM game scene with CSS text above the classic DOOM logo, HUD showing 50 ammo, 100% health, 0% armor.
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...
Photo of a tablet on a desk with LEGO bricks, pens, and a coffee cup. The screen shows "The Layout Maestro" with a purple grid logo.
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” title next to a folder tree icon with a v3.0 badge, utilitybend logo above.
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...
Safari Web Inspector timelines view with CPU and Memory graphs, overlaid by Safari icon and the headline “WebKit Features for Safari 26.4”.
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...
Screenshot of browser developer tools with a large Firefox logo overlaid and the text “Firefox 149”.
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 logo surrounded by labels: Format, Lint, Transpile, Bundle, Minify, and Analyze.
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” title, a cat photo with a folded corner effect, and CSS code with .ImageContainer shadow and clip-path properties.
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” by Patrick Brosset on CSS-Tricks, with a curved stack of labeled folder icons on a purple-pink gradient.
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” title, {Bloomberg JS Blog} logo, Temporal.PlainDate code snippet, and JS logo.
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/...
“View Transitions Mock” diagram comparing native implementation with view-transitions-mock from state A to state B, where four visual steps are crossed out with red X marks.
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” title, author’s photo, Sass code with $spacing variable and .card mixin on the left, native CSS with custom property and @media query on the right.
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...” title, letters T, A, B, L, E, S in table cells, Frank M Taylor in a cell, a Germanic languages table, and a BetterTable class code snippet.
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...
Graphic with the text “New in Chrome” and the number 146, alongside the Chrome logo on a red grid background.
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” title and four CSS snippets: .visually-hidden with 11 properties, and three minimal alternatives with 2–3 properties each.
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...
Title “SVGs on the web: performance comparison based on how you load them”, author Joan León, code snippets, and a table comparing five SVG loading methods.
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-...
“Introducing CodePen 2.0 Beta” text, pixel-art “2.0” sign, and 3D blocks with Markdown, Vue, and other technology logos.
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
“The Too Early Breakpoint” title with author’s photo and a breakpoint diagram showing layout changes at Default, ≥ 220px, ≥ 350px, ≥ 480px, and ≥ 620px.
The too early breakpoint. Ahmad Shadeed shows why many sites switch to mobile layout too soon, breaking designs in split-screen and tablet views. The fix: container queries and flexible CSS layouts. #css #layout
ishadeed.com/article...
Author’s photo with HTML terms div, role, span around it, HTMHell logo, and “A new meta tag for respecting text scaling on mobile” title.
A new meta tag for respecting text scaling on mobile. @matuzo.at shows how the proposed <meta name="textscale"> element lets websites honor OS text size settings in mobile Chrome. Units like em and rem scale, pixel values stay fixed. Only in Canary so far. #html #a11y
youtu.be/XVIgKEOVfVg
“Dictionary Compression is finally here, and it’s ridiculously good” title, HTTP and Performance tags, and a close-up of a dictionary page with the “technology” entry.
Dictionary compression is finally here, and it’s ridiculously good. Tim Perry shows how Compression Dictionary Transport can shrink JS bundles up to 90% for returning users. Already used by Google, Shopify, and Pinterest in production. #performance #http
httptoolkit.com/blog...
“Define the Theme Color for Safari 26” title, author’s photo, three Safari windows showing The Verge with dark chrome, Piccalilli with white and red chrome, DevTools with background: red.
Define the theme color for Safari 26. Martin Grubinger shows how to work around the dropped <meta name="theme-color"> with scroll-driven animations and a hidden fixed element that sets the browser chrome color. #safari #css
grooovinger.com/note...
“Native Random Values in CSS” title with author’s photo and a pile of colorful dice.
Native random values in CSS. Álvaro Montoro explores random() and random-item(), two new CSS functions. random() returns a value within a range, random-item() picks from a list. Both support sharing to correlate results. Only Safari 26.2 so far. #css #safari
alvaromontoro.com/bl...
“Making WebAssembly a first-class language on the Web” headline, Mozilla Hacks logo, and a code snippet with import image from image-lib.wasm.
Making WebAssembly a first-class language on the Web. Ryan Hunt says JS-only loading and Web API glue code hurt DX, and the Component Model could add direct bindings and easier imports. #webassembly #firefox
hacks.mozilla.org/2026/02/maki...
“Practical guide to the img element: from the basics to LCP” title, author’s name Joan León, code snippets, table of contents, and hashtags: images, webperf, core-web-vitals, html.
Practical guide to the <img> element: from basics to LCP. @nucliweb.net shows how srcset, sizes, modern formats AVIF and WebP via <picture>, fetchpriority, preload for the LCP image, and CDNs can improve Core Web Vitals. #performance #html
joanleon.dev/en/guia-prac...
Screenshot of browser developer tools with a large Firefox logo overlaid and the text “Firefox 148”.
Firefox 148 release notes for developers. The release adds the HTML Sanitizer API and Trusted Types, plus Iterator.zip() and zipKeyed(), the CSS shape() function, improved anchor positioning, and the experimental Document Picture-in-Picture API. #firefox
developer.mozilla.org/en-US/docs/M...
Josh Comeau logo and Sprites on the Web title, with a cartoon person and a row of trophy sprites. CSS and an img tag code snippet on the right.
Sprites on the web. @joshwcomeau.com shows how to animate spritesheets in CSS within the <img> viewport: object-fit, object-position, and steps(jump-none) for clean frame-by-frame motion, plus when sprites beat GIFs, and when procedural animation is better. #css
www.joshwcomeau.com/animation/sp...
Author’s photo beside the headline “An in-depth guide to customising lists with CSS”, the name Richard Rutter, code snippets, and Piccalilli logo.
An in-depth guide to customizing lists with CSS. @clagnut.com covers lh indents, ::marker styling limits, and cross-browser symbols via @counter-style, plus a ::before fallback when support for some features might be limited. #css
piccalil.li/blog/an-in-d...