Design News

What’s moving the web.

Focused updates on CSS, browser features, accessibility, UI engineering, and the tools behind better interfaces.

Editorial illustration of abstract CSS typed values resolving into a unitless value and length or angle outputsCSS

Firefox 158 gives CSS typed arithmetic a practical role

Firefox 158 supports CSS typed arithmetic, letting compatible values become unitless ratios that can be deliberately converted into lengths, angles, and other numeric types.

2026-10-23Read story →
Editorial illustration of a floating panel aligned to an abstract anchor with cyan placement guidesUI engineering

Chrome DevTools adds a visual editor for CSS position-area

Chrome DevTools now offers a visual position-area editor, helping teams choose and inspect anchor-positioning regions while keeping the resulting CSS declaration reviewable.

2026-10-21Read story →
Editorial illustration of an SPA moving through several app views into three abstract performance instruments, representing soft-navigation measurementUI engineering

CrUX now shows an experimental soft-navigation view for SPAs

CrUX now exposes experimental LCP, INP, and CLS fields that include SPA soft navigations, so teams can compare a route-aware view without replacing their stable Core Web Vitals reporting.

2026-10-19Read story →
Editorial illustration of a browser scrollbar with two CSS feature-detection paths converging into a standards-first interfaceCSS

Firefox 156 makes scrollbar feature detection more honest

Firefox 156 now reports ::-webkit-scrollbar as unsupported in @supports, making a standards-first scrollbar cascade easier to express without claiming full WebKit pseudo-element support.

2026-10-16Read story →
Editorial illustration of responsive interface panels aligned to a 320-to-1200 viewport ruler and a 43 percent progress barCSS

CSS progress() is ready for responsive value calculations

The now-Baseline CSS progress() function turns a position between two bounds into a reusable responsive ratio, with a careful path for fallbacks and no-clamp.

2026-10-14Read story →
Editorial illustration of a refined navigation label whose underline leaves a deliberate gap across a whitespace boundaryCSS

Edge 155 gives text decorations more room around spaces

Edge 155 adds text-decoration-skip-spaces, a progressive CSS refinement for deciding where underline, overline, and line-through lines leave whitespace gaps.

2026-10-12Read story →
Editorial illustration of a JPEG XL image moving through a browser delivery checkpoint toward a detailed landscape photoBrowser features

Chrome 155 puts JPEG XL on the image-pipeline test bench

Chrome 155 makes JPEG XL worth a measured image-pipeline test alongside AVIF—not a blanket fallback-removal decision.

2026-10-09Read story →
Editorial illustration of vector paths passing through a quality-review checkpoint toward browser testing panelsBrowser features

SVG 2’s new Candidate Recommendation is a cue to check your graphics pipeline

W3C’s updated SVG 2 Candidate Recommendation is a useful prompt to test real graphics workflows—not a universal browser-support announcement.

2026-10-07Read story →
Editorial illustration of a block container trimming only its outer child margins while preserving internal spacingCSS

Chrome 155 beta gives block layouts a margin-trim option

Chrome 155 beta introduces margin-trim for block and multicol containers, offering a progressive way to remove only a stack’s outer child margins.

2026-10-05Read story →
Editorial illustration of a scroll-marker rail showing sequential and active-only keyboard focus conceptsAccessibility

Chrome 154 gives CSS scroll markers two focus models

Chrome 154 adds links and tabs modes to CSS scroll markers, letting component authors choose matching focus order and accessibility semantics.

2026-10-02Read story →
Editorial illustration of a frontend debugging workflow linking inspection, performance traces, and source evidenceUI engineering

A DevTools triage loop for interface regressions

Chrome’s latest DevTools recap points to a practical workflow for connecting component inspection, soft-navigation traces, and evidence handoff.

2026-09-30Read story →
Editorial illustration of layered CSS rule cards and an @supports gate for CSSFolder design newsBrowser features

Firefox 157 Beta makes CSS at-rule feature detection easier

Firefox 157 Beta adds at-rule() support to @supports, giving authors a direct way to gate newer at-rules such as @scope while keeping a dependable fallback.

2026-09-26Read story →
Browser features

Chrome 153 puts scroll-axis-lock on the CSS watch list

Chrome 153 documents scroll-axis-lock and single-axis scroll containers for experimental channels, giving UI teams a clearer way to reason about nested scrolling.

2026-09-26Read story →
CSS

A practical guide to container size and style queries

MDN explains how components can respond to container size and custom-property-driven style conditions instead of relying only on viewport breakpoints.

2026-09-25Read at MDN Web Docs ↗
Browser features

Baseline 2026: CSS features worth watching

The evolving Baseline 2026 set includes practical CSS capabilities such as field-sizing, container style queries, @scope, and contrast-color().

2026-09-25Read at web.dev ↗
CSS

How to choose between media and container queries

Use media queries for viewport-wide decisions and container queries when a component should respond to the space it actually receives.

2026-09-25Read story →