Web Standards
@web-standards.dev
📤 318
📥 0
📝 176
Daily web platform news by
@pepelsbey.dev
https://web-standards.dev/
Introducing the Safari MCP server for web developers. Saron Yitbarek presents a Model Context Protocol server giving AI agents access to the DOM, network data, screenshots, and console in Safari through 16 local tools. #safari #ai
webkit.org/blog/1813...
about 5 hours ago
0
0
0
What’s new in Chrome 150. AccentColor system colors for installed apps, polygon() corner rounding, animatable zoom, url() modifiers, the new text-fit property, background-clip: border-area, and scroll methods that return promises. #chrome #browser
developer.chrome.com...
1 day ago
0
2
0
A11y​.quest: 128 questions to level up your accessibility game. Dave Davies built an interactive quiz across topics like semantic HTML and ARIA, sorted by difficulty, with accuracy tracking, streaks, and shuffle. #a11y #html
https://a11y.quest/
2 days ago
0
1
1
Modern CSS theming with light-dark(), contrast-color(), and style queries. @una.im layers light-dark(), @​property, contrast-color(), and @​container style() queries to build accessible, composable themes that adapt elevation per mode. #css #color
una.im/modern-css-th...
3 days ago
0
7
1
Your grid lanes will likely fail WCAG 2.4.3. @matuzo.at shows how grid lanes reorder items to balance column heights, breaking the match between tab order and visual order. The flow-tolerance property helps, and reading-flow may fix it. #css #a11y
www.matuzo.at/blog/2...
4 days ago
0
8
1
What’s missing from SVG. Patrick Brosset gathered developer feedback from bug trackers, Interop proposals, and surveys to map eleven gaps, from external styling and CSS integration to text wrapping, reuse, geometry APIs, and accessibility. #svg #css
patrickbrosset.com/a...
7 days ago
0
2
0
Experimenting with random() in CSS. Kilian Valkhof, on the Polypane blog, explores CSS random() with demos for bokeh, falling petals, a photo stack, and an aurora. Works in Safari 26.2+ and Chromium 148+ behind a flag. #css #animation
polypane.app/blog/ex...
8 days ago
0
7
5
Animating <dialog> with view transitions. Rik Schennink swaps view-transition-name from a <button> onto the <dialog> inside startViewTransition() to morph button into modal. Behind a prefers-reduced-motion check. #css #viewtransition
pqina.nl/blog/animat...
9 days ago
0
7
2
Improving card patterns with anchor positioning. Emil Björklund covers a card with a link pseudo-element, then an anchor() inset stops it above the secondary actions, keeping dead space around the favorite button. #anchor #css
thatemil.com/blog/cl...
10 days ago
0
3
0
Releasing Babel 8 today. The Babel team ships version 8 after eight years: now ESM-only needing Node.js 22+, no longer compiling to ES5 but targeting modern browsers via Browserslist, with loose and spec replaced by per-tradeoff assumptions. #js #tools
babeljs.io/blog/2026...
11 days ago
0
1
0
The fundamentals and dev experience of CSS @​function. @janeori.propjockey.io covers custom CSS functions: typed arguments with defaults, private internals, return type validation, and DX gotchas like silent failures and missing spread syntax. #css #learn
frontendmasters.com/...
14 days ago
0
1
1
Context-aware headings in HTML. @matuzo.at explores headingoffset, an HTML attribute that offsets descendant heading levels in the accessibility tree without changing the tags. Useful for web components. In Firefox Nightly. #html #a11y
www.matuzo.at/blog/2...
15 days ago
0
12
3
Firefox 152 release notes for developers. The field-sizing CSS property, Notification actions in showNotification(), unadjustedMovement for requestPointerLock(), and experimental text module imports with { type: "text" }. #firefox #browser
developer.mozilla.or...
16 days ago
0
4
2
Introducing the field guide to grid lanes. Jen Simmons announces a new learning resource for CSS grid lanes with a playground, reference, and six real-world demos. Best in Safari 26.4+. #css #layout
webkit.org/blog/1809...
17 days ago
1
4
1
CSS reacts, JS just listens. @nerdy.dev’s prop-for-that library exposes runtime state to CSS through custom properties: pointer position, scroll velocity, battery, viewport, and 16+ more, no event handlers needed. #css #js
prop-for-that.netlif...
18 days ago
1
36
8
Web technology sessions at WWDC26. Saron Yitbarek rounds up six WebKit talks: Safari 27 beta, CSS grid lanes, customizable <select>, the <model> element, immersive visionOS environments, and web extensions. #safari #browser
webkit.org/blog/1797...
21 days ago
0
2
3
The quiet problem with unnecessary async. Matt Smith warns that async without real asynchronous work changes a function’s contract, propagates outward through callers, and hides where real I/O actually happens. #js #performance
allthingssmitty.com/...
22 days ago
0
1
0
CSS animated SVG maps. Amber Weinberg shows how to stagger pin opacity, fade in the background, and draw lines with stroke-dasharray and stroke-dashoffset, all inside a prefers-reduced-motion media query. #css #svg
amberweinberg.com/cs...
23 days ago
0
2
1
News from WWDC26: WebKit in Safari 27 beta. Jen Simmons introduces 58 new features and 525 fixes: customizable <select>, scroll anchoring, transform-aware anchor positioning, WebAssembly JSPI, and top-level await. #safari #browser
webkit.org/blog/1796...
24 days ago
0
1
0
Introducing the CSS Property Type Validator Stylelint plugin. Schalk Neethling released the first beta that validates @​property registrations, custom property assignments, and var() usage in your linting workflow. #css #tools
schalkneethling.com/...
25 days ago
0
4
4
The website specification. @joost.blog published a platform-agnostic reference of technical features a quality website should have, covering HTML, SEO, accessibility, security, performance, internationalization, and agent readiness. #html #a11y
specification.website
28 days ago
0
6
2
What’s new in Chrome 149. CSS gap decorations for grid and flexbox, shape-outside with path() and shape(), SVG path-length as a CSS property, image-rendering: crisp-edges, and WebSocket connections that no longer block back/forward cache. #chrome #browser
developer.chrome.com...
29 days ago
0
6
0
CSS is filling the gaps with rules. Brecht De Ruyte introduces column-rule, row-rule, rule-break, rule-inset, rule-overlap, and rule-visibility-items for styling gaps in grid and flex layouts. The rules are animatable too. #css #layout
utilitybend.com/blog...
about 1 month ago
0
6
2
The state of CSS centering in 2026. @css-only.dev compares flexbox, grid, position: absolute, and text-align, explains text-box, anchor-center, and safe vs unsafe centering. #css #layout
css-tricks.com/the-s...
about 1 month ago
0
8
9
Entry and exit transitions with modern CSS. matia đź‡đꇷ shows how @​starting-style, transitions with allow-discrete, and the View Transition API together create smooth, interruptible animations for <dialog> and popovers. #css #animation
joyofcode.xyz/entry-...
about 1 month ago
0
2
0
Replacements​.fyi. A tool from the e18e collective that helps you find more performant and safer replacements for outdated or unnecessary npm packages. Type a package name and get drop-in alternatives or short code snippets to use instead. #npm #tools
replacements.fyi/
about 1 month ago
0
67
11
CSS vs. JavaScript animations. Josh W. Comeau shows CSS and the Motion library stay smooth when the main thread is busy, while JS and the GSAP library freeze. Use native CSS when you can, and reach for JS only for what CSS can’t do. #animation #performance
www.joshwcomeau.com/...
about 1 month ago
0
5
1
Better fluid sizing with round(). Ahmad Shadeed shows how the CSS round() function complements clamp() by snapping fluid values to consistent intervals, avoiding awkward decimals like 19.7px in typography, spacing, and baseline grids. #css #typography
ishadeed.com/article...
about 1 month ago
0
7
2
Declarative partial updates. Barry Pollard and Noam Rosenthal introduce processing instructions and new setHTML(), appendHTML(), streamHTML() methods for inserting HTML out of order into specific document locations. #html #api
developer.chrome.com...
about 1 month ago
0
11
5
600+ million people write right-to-left: two fixes your app needs. Nina Torgunakova from Evil Martians shows how dir="auto" handles RTL input in English apps, while dir="rtl" plus logical CSS properties enable fully localized UIs. #css #a11y
evilmartians.com/chr...
about 1 month ago
0
2
1
Look up web platform features from your terminal. Patrick Brosset’s wf command shows Baseline status, MDN docs, specs, browser bugs, survey results, and Chrome usage, with data from the W3C WebDX Community Group. #tools #baseline
www.npmjs.com/packag...
about 1 month ago
1
6
1
State of CSS 2026. Devographics opened the annual CSS survey, this year focused on the features that matter most. It takes 15–20 minutes and helps map how developers actually use modern CSS. #css #survey
survey.devographics....
about 1 month ago
0
0
2
Modern web guidance. A set of expert-vetted skills from the Chrome team that guide AI coding agents toward accessible, performant, and secure web practices, helping with modern features like <dialog>, popover, container queries, passkeys, CSP. #tools #ai
developer.chrome.com...
about 1 month ago
2
11
4
Firefox 151 release notes for developers. New shadowrootslotassignment attribute for <template>, @container style() queries, position-anchor: normal, Document Picture-in-Picture API, desktop Web Serial, and keyboardLock in fullscreen. #firefox #browser
developer.mozilla.or...
about 2 months ago
1
16
5
State of AI 2026 survey results. Sacha Greif’s annual survey of 7,258 developers shows AI-assisted coding has gone mainstream, with respondents generating 54% of their code with AI, up from 28% last year. #ai #survey
2026.stateofai.dev/e...
about 2 months ago
0
0
1
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...
about 2 months ago
0
3
2
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...
about 2 months ago
0
4
0
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-...
about 2 months ago
0
2
2
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...
about 2 months ago
0
2
0
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/...
about 2 months ago
0
6
3
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...
about 2 months ago
0
7
7
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...
about 2 months ago
1
13
5
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...
about 2 months ago
0
1
0
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...
about 2 months ago
0
2
2
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...
2 months ago
0
1
0
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/...
2 months ago
0
5
2
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/...
2 months ago
0
2
1
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/...
2 months ago
0
7
1
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...
2 months ago
0
1
0
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...
2 months ago
0
8
3
Load more
feeds!
log in