Skip to content
Frontend Feeds
  • Today
  • Archive
  • Sources
  • Categories
    • The Giants6 Sources
    • Multi Author Blogs18 Sources
    • Top Front-end Bloggers25 Sources
    • More Front-end Bloggers77 Sources
    • Browsers, engines, etc.11 Sources
    • Libraries, Frameworks, etc.12 Sources
    • Company/Startup Blogs12 Sources
    • Developer/Designer News4 Sources
    • YouTube Channels13 Sources
    • Podcasts7 Sources

Multi Author Blogs

Frontend Focus

4 itemsVisit site โ†—

Wednesday, 11 November 2026

  • Frontend FocusMulti Author Blogsread at source

    Responsive design is more than resizing a window

    ๐Ÿš€ Frontend Focus #โ€‹766 โ€” November 11, 2026 | Read on the web Beyond the Viewport: Introducing Site Seeing โ€” Making a design responsive means tackling more than just resizing, with real users often having on-screen keyboards, split views, docked DevTools, and other things open, or even using oddly sized in-app browsers. Ahmad's new, free browser-based tool is designed to preview your layouts in these awkward contexts. Ahmad Shadeed Run AI Coding Models on Your Own Machine โ€” Local models are now good enough for everyday coding. Learn to run them on your own Mac or GPU, wire them into your editor and terminal agents, and keep your code private with no per-token bill. Master.dev sponsor ๐Ÿค– Modern Web Guidance 1.0: Web Expertise for AI Agents โ€” Coding agents can write good code, but tend to fall behind on Web standards and best practices. Chrome's skills for steering agents toward modern, Baseline-aware HTML/CSS are now stable, and it's not just Google: Lea Verou, Patrick Brosset (Edge), and Jake Archibald (Firefox) are among the project's owners. Philip Walton (Google) The Web is More Than Enough โ€” An encouraging reminder of the immense power of the Web platform and how advanced use of WebAssembly, Web Crypto, WebGL, and Web Audio is increasingly within the reach of developers to build apps you'd once never have imagined in the browser. Paul Ford โšก๏ธ IN BRIEF ๐Ÿ—ณ๏ธ The State of JS survey for 2026 is open now and seeking responses . ๐ŸฆŠ Firefox 160 is now stable. On-device speech recognition via the Web Speech API arrives on desktop, and you can experiment with blocking="render" and lazy loading for video and audio behind flags. โ™ฟ GitHub now recognizes an ACCESSIBILITY.md file and surfaces it on a repository's overview page. ๐Ÿฆ“ Zigzag is a new lightweight browser for macOS , coming in at just 18MB. ๐Ÿ“™ Articles, Opinions & Tutorials Computing with CSS Layout โ€” How much can CSS 'compute' on its own? Leaning on the behavior of CSS grid, flexbox, and more, this interactive piece shows how to read CSS's 'calculations' back as numbers and put them to practical use, including drawing animated charts. Agustin Capeletto System Colors Need to Work Together โ€” You might expect paired CSS system colors like HighlightText and Highlight to be readable together, but in Chrome on Android's dark mode they manage a contrast ratio of only 1.98:1. Aaron's cross-browser study shows which pairs hold up. Aaron Gustafson How to Build Your Own Automated Debugging Workflow โ€” Connect your coding agent to Sentry and turn errors into fix PRs. See the guides and recipes in the resource hub. Sentry sponsor Is 'Using Declarations Just Once' Still Effective in CSS? โ€” This classic optimization technique merges repeated declarations under one grouped selector. Jens built a tool to test it on 30 real sites and found it can still cut uncompressed file size, if applied selectively. Jens Oliver Meiert Local Visual Regression Testing for Agents with Playwright โ€” A look at using Playwright's toHaveScreenshot matcher to give coding agents a consistent local visual-feedback loop. Paolo Ricciuti Building Interfaces That Understand What Users Want to Do โ€” A look at using small AI 'decision models' to pick from options you define, including via Chrome's experimental, on-device Decisions API. Agustin Barrientos CSS-Tricks, Version 20 โ€” Now under new ownership, the site is getting JavaScript cleanup, a Sass reorganization, and more, which Geoff explains in detail. Geoff Graham A Groundbreaking Upgrade to SVG is Approaching: Linked Parameters are Almost Here Roman Komarov Making Immersive LLM Chat Experiences More Accessible Eric Bailey Re-Implementing :nth-child() with Modern CSS Temani Afif ๐Ÿงฐ Tools, Code & Resources Britecharts 3.0: Ready-Made, Accessible D3 Charts โ€” A long-awaited major release for this library of reusable D3 charts makes them accessible by default, with screen reader data tables and keyboard navigation. Also adds dark mode, TypeScript types, and a treemap. The docs are really good. Marcos Iglesias The โ€œExport CSVโ€ Button Shouldnโ€™t Time Out โ€” Exports scan every row in the range and slow as data grows. TimescaleDB keeps them fast. $1000 credit on Tiger Cloud . Tiger Data (creators of TimescaleDB) sponsor ๐ŸŽจ This Hue Shall Pass: A Contrast Checker That Fixes Failing Color Pairs โ€” Paste in a palette to get a grid of every foreground and background pairing, graded against WCAG AA or AAA. It doesn't just flag failures, you can also nudge near-misses into passing while keeping the hue intact. More background here . Clearleft Liquid Glass Forge: Refraction Behind Native HTML Controls โ€” An experimental WebGL2 and CPU rendering engine for glass refraction, a la Apple's Liquid Glass. You can see a demo here . Nami Poursafargholi ๐Ÿ”ก Tinkerfont: A Font Inspection and Switching Tool for Chrome & Firefox โ€” Install this extension and you get a quick way to inspect fonts on the current page (and their properties), and try alternative fonts directly on the page. Mighil BagUI: Components & Blocks for Building SaaS Landing Pages โ€” A free collection that includes clean, customizable marketing pages, app pages, blocks, and templates for React and shadcn/ui users. Source code . Anelka Bagalane Master CSS 2.0: A Markup-Driven CSS Language โ€” A utility-class framework where one class can carry a value, selector and condition (e.g. fg-blue-70:hover@sm ). v2 adds design tokens defined in your own CSS, a wide-gamut color palette, and linting and editor tooling. Aoyue Design ๐Ÿ“ฐ Classifieds ๐Ÿ” Your agent checks web work with a refresh. On mobile it needs a device. Expo Simulators gives it one in the cloud. ๐Ÿ“… Booking forms without a backend : Real availability, live totals and deposits via your own Stripe or PayPal. CraftForms, from โ‚ฌ6/month . โœ๏ธ Foxit : Still redirecting users to a signing portal? 6 eSignature APIs compared on embedded signing, pricing and integration effort. ๐Ÿ›‘ Finally, if you want to keep the bots out โ€ฆ A Blunt Banhammer Blocks Basic Bots Ballistically โ€” Terence Eden's site was plagued by bots using up his bandwidth, so he built an interesting honeypot that lures the robots.txt -ignoring bots in and hands out a ban. It works, with an almost 90% drop in bandwidth used, but there are some tradeoffs. If you're happy to lean on the cloud for protection, Nick Gray recounts his year of fighting scrapers with Cloudflare , including his firewall rules and failed experiments. Meanwhile, with a moreโ€ฆ 'creative' approach, Utku Sen filled a test site's code with taboo phrases and found AI agents refused to touch it . This may be more useful if you want to prevent casual reverse engineering/vulnerability hunting, though. Finally, even if you welcome crawlers, they can make your analytics misleading. Hugo Attal looked into his server logs and found 90% of his 'human' visitors were bots . Till next timeโ€ฆ

Wednesday, 4 November 2026

  • Frontend FocusMulti Author Blogsread at source

    Safari will 'dark mode' your site for you

    ๐Ÿš€ Frontend Focus #โ€‹765 โ€” November 4, 2026 | Read on the web Safari Introduces Adaptive Dark Mode โ€” A new (opt-in) feature added to the Safari 27.3 beta that automatically adapts light sites to dark ones. It's here because although around 40% of pages are loaded by users using dark mode, only 10% of page loads directly support it. WebKit Agents Didnโ€™t Clear Your Plate. They Dumped Reviews on It โ€” Your agents write PRs in minutes, then eat your afternoon in review. When did โ€˜saving timeโ€™ start to mean babysitting agentsโ€™ work? Meticulous verifies every UI change, with no developer effort. Devs at Dropbox & ElevenLabs have their afternoons back. You can too. Meticulous sponsor Modern CSS Might Make Your Front-End More Complex โ€” Swapping JavaScript for container queries and :has() can cut your code down but introduce bugs elsewhere in your layout. Gabriel shares four examples, including why container-type can collapse flex items to zero width. Gabriel Shoyombo ๐Ÿ“Š Design Systems Should Be Fast by Default โ€” Den benchmarks dropdowns and checkbox lists across ten popular design systems, diagnoses the slowdowns, and shares tests to catch regressions. Den Odell โšก๏ธ IN BRIEF ๐Ÿคš The CSSWG has resolved that form controls get cursor: pointer by default under appearance: base . Cory LaViska explains the data and the objections. ๐ŸŒ Chrome 158 is in beta ( stable due November 17 ) with the install > element, media pseudo-classes like :playing and :paused , ::highlight(*) , and XSLT is on its way out . ๐Ÿ†• Rachel Andrew shares an update on changes to the web platform in October, including scroll-driven animations gaining support across all major engines. ๐Ÿงฐ Chrome DevTools has added a visual position-area editor in Elements, Web Install manifest diagnostics, and MCP server improvements. ๐Ÿค– Google will support a shared AI training control in robots.txt , based on IETF AIPREF work, letting sites set a preference once for multiple AI providers. ๐Ÿ“™ Articles, Opinions & Tutorials Native Masonry Layouts with CSS Grid Lanes โ€” A practical guide to native masonry layouts with CSS Grid Lanes, covering placement, fit-tolerance, horizontal layouts, subgrid and source-order accessibility. It's supported in only Safari right now, but other engines are working on it. Saleh Mubashar Making Features Generic in CSS โ€” Rachel takes a look at the new flow-start and flow-end alignment keywords, and touches upon why the CSSWG often renames things. Rachel Andrew Embeddable Forms With Bookings, Live Pricing, and Payments Built In โ€” Build it visually, paste two lines into any site. Unlimited submissions on every plan with spam protection. From โ‚ฌ6/mo. CraftForms sponsor Quirks and Vintage Uses of CSS Table Display โ€” Looks back at display: table and its related values, sharing what each does and the pre-flexbox tricks they enabled โ€” while of course noting that you probably shouldn't reach for them today. A neat history lesson. Declan Chidlow ๐Ÿงก If You Love a Website, Back It Up โ€” Following one of their favorite websites disappearing, a web-archiving practitioner explains how to go about preserving sites for yourself. A practical tour of browser-based capture techniques, automated crawling, and embedding the results. Misty De Meo Spreading Liquid with Three.js โ€” A technical walkthrough of a neat liquid-spreading effect (built for a cosmetics campaign). It shows off using a height map for thickness, a velocity map for movement, and fragment shaders to render the result. There's a satisfying demo to play with, too. MISAKI NAKANO How a Split Webfont Slowed Down Text Layout โ€” A font splitter put i and j in a different file from the rest of the alphabet, forcing extra text-shaping work within words (causing INP to suffer). Here's why, plus a script to check your own font CSS. Ivan Kristianto Why Is the Analytics Tab the Slowest Page in Your App? โ€” Usually it's one query scanning months of rows. TimescaleDB extends Postgres to make it fast. Get $1000 credit . Tiger Data (creators of TimescaleDB) sponsor Multi-Column Different-Speed Scrolling โ€” There are some fun scrolling experiments here thanks to scroll-driven animations. Chris Coyier Useful @custom-media Presets Daniel Schwarz โš ๏ธ Third-Party Scripts Last week we shared a PSA about forgotten script tags and how what they load can be hijacked. Days later, a similar attack prominently appeared in the wild. On October 29, a performance monitoring script on Polymarket was swapped for a wallet drainer . The URL of the script didn't change, just the payload, so the CSP let it through, but Scott Helme's write-up explains what would have stopped it. Whatever you load from third parties, it's worth auditing for security, privacy, and performance reasons. Some steps worth taking: Pin scripts with Subresource Integrity where the vendor's file is static, and use the new Integrity-Policy-Report-Only header to find any you've missed. Self-host third-party resources where you can. Request Metrics explains how it protects its own agent and why it's safe to self-host. Load third-party JavaScript efficiently , or use Partytown to move it off the main thread entirely. Audit what your page is loading with Request Map and Third Party Web . Lastly, if you provide third-party scripts to users, check out Jack Ellis's writeup of how Fathom Analytics keeps their analytics script secure for some tips. ๐Ÿงฐ Tools, Code & Resources sidebearing-trim: Align Text by 'Visible Ink', Not by Glyph Boxes โ€” You can try it out interactively on the page and there's a write-up of why you should care here . One of those things that designers, in particular, are likely to notice! ๐Ÿ˜… GitHub repo . Pekka Lammi ๐ŸŽจ ColorSym: Symbols to Identify Colors 'When Color Alone Isn't Enough' โ€” A way to use symbols to supplement colors, aiding with accessibility. The symbols are 'intelligent' where, for example, the orange symbol is a combo of those for red and yellow. Available as SVGs or a custom font. Chris Eastridge & Luis Francisco Astrotypes: Curated Font Pairings for Astro โ€” Search and preview font pairings sourced from Google Fonts, Bunny CDN, and Fontshare live on the page. Each pair has a copy command for various tools (npm, Yarn, Bun, etc). Michael Andreuzza File Viewer: A Browser-Native Office, PDF, CAD, and Archive Viewer for Internal Web Apps โ€” Provides read-only views for Office, PDF/OFD, CAD, archives, email and more, with integrations for React, Vue, and Svelte. There's also a live demo to try. Flyfish Dev ๐Ÿ“ฐ Classifieds Know React? Then you and your coding agent can ship iOS and Android apps. Expo runs the builds and CI/CD and gets you into the app stores. ๐Ÿงช In-browser testing inside your dev server. TWD adds a test sidebar next to your app, and your AI agent runs it too. Free and MIT . ๐Ÿ”ค ...and finally Introducing Geist Serif โ€” Vercel's Geist family gains a high-contrast display serif for headlines, built on the same metrics as Geist Sans so the two mix cleanly. Geist Sans , Geist Mono and Geist Pixel are on Google Fonts already; Serif isn't yet, but will be in due course. Vercel

Wednesday, 28 October 2026

  • Frontend FocusMulti Author Blogsread at source

    The spyware hiding in old script tags

    ๐Ÿš€ Frontend Focus #โ€‹764 โ€” October 28, 2026 | Read on the web ๐Ÿ–ผ๏ธ HTML-in-Canvas: Interactive DOM Inside 2D, WebGL and WebGPU Canvases โ€” Arriving in stable Chrome next week, this long-incubated API draws real, live HTML into 2D, WebGL and WebGPU canvases, with text selection, form controls, Find-in-Page and screen readers all still working. Three.js, Babylon.js and PixiJS already support it. Chrome-only for now, but a big leap for canvas-heavy UIs. There's a related video here too . Natalia Markoborodova (Chrome) Creating Dynamic Social Media Cards for User Content โ€” Chris digs into how links unfurl across Discord, X, Slack, Bluesky, iMessage and more, and argues most dynamic social cards waste the image by just restating the title and description. Then he shows what should go on it instead. Chris Coyier Would You Let Your AI Agent Grade Its Own Homework? โ€” Agents write code faster than ever. They even review their own work. But whoโ€™s reviewing them? Dropbox, Notion & ElevenLabs donโ€™t take the risk. With Meticulous, every change is exhaustively verified, with zero developer effort. Meticulous sponsor DeadTag: Forgotten Third-Party Script Tags Became a Delivery Network for Spyware โ€” Attackers are buying up expired domains once used by analytics, ad and widget scripts, so any site still carrying the old tag now silently loads attacker code. A worthy reminder to go audit those tags! Scott Helme โšก๏ธ IN BRIEF ๐ŸŽ‰ CSS-Tricks , after a spell under the ownership of DigitalOcean, is independent once again under the stewardship of editor Geoff Graham . ๐ŸฆŠ Firefox 159 enables scroll-driven animations by default, so they now work in all major engines. It also adds scoped custom element registries. ๐Ÿชช Since Chrome 155, sites can use the Digital Credentials API to offer credentials , such as digital IDs, to a compatible wallet app on the user's phone. โš™๏ธ W3C has launched a polyfill pilot for WebMCP , a JavaScript API that exposes web app functionality as agent-callable tools. ๐ŸŒ… The Arc browser is being sunset this December, and Dia is suggested as a viable alternative. Zen is another, non-Chromium variant. ๐Ÿ“บ Firefox has โ–ถ๏ธ a new ad with various 'meme icons' from years gone by (Numa Numa Guy kicks things off). ๐Ÿ“™ Articles, Opinions & Tutorials WebKit Features for Safari 27.1 โ€” A fresh release of Safari came out alongside Apple's new foldable. There's advice on how to create layouts for folding screens using Device Posture API and the Viewport Segments API . Both are behind feature flags for now. Jen Simmons (WebKit) ๐Ÿ’ก Safari 27.2 followed days later , adding ::field-content for styling a customizable select's displayed text, and renaming Grid Lanes' flow-tolerance to fit-tolerance . Investigating a Curious Case of Font Format Fallbacks โ€” Paul chases a bug in which a site's font loaded three times in a row , as WOFF2, then WOFF, then TTF, following the browser's error messages into Chromium's own source to find the cause. Paul Calvano ๐Ÿ—“๏ธ Workshop: How to Implement Session Replay โ€” Filters, custom tags, and sampling settings for finding the sessions that matter. Nov 5, 10am PT. Sentry sponsor Performance Budgets Need a Representative Worst โ€” Harry revises his own long-standing advice: a budget set from your single worst result lets one outlier hide real regressions, so start from a representative worst (P90 or P95 of recent data) instead. A spreadsheet template is included. Harry Roberts โ–ถ The Most Vulnerable Week in Internet History โ€” A fast recap of a rough security week: PHP2Shell (a pair of PHP engine bugs allowing unauthenticated RCE), a backdoored LiteLLM release, a CA with private keys that were numbers under 256, and more. Fireship Building an Isolated Preview for AI-Generated HTML โ€” Any app that lets a model generate UI has to render the HTML it hands back. Keshav builds five demos showing how a preview can be attacked, then hardens it with iframe sandboxing, CSP and a carefully checked postMessage handler. Keshav Malik ๐Ÿ–จ๏ธ Websites Should Be Printable โ€” Brennen printed his own site, didn't like the result, and walks through the print stylesheet changes that fixed it: a hidden header, 12pt type, and black links. Brennen Puth โ–ถ Why I'm Still Making CSS Tutorials โ€” On caring about the craft of little details and why they matter in an age of agentic code generation. Kevin Powell ๐Ÿงฐ Tools, Code & Resources TitleArt: Make Text Like It's 1997 โ€” Aww yeah, a big dose of nostalgia for users of Microsoft Office back in the 90s. Every classic WordArt style, shape and 3-D effect recreated in the browser. Davey Barker The โ€œLast 90 Daysโ€ Filter Shouldnโ€™t Need a Spinner โ€” Bigger date ranges mean your chartโ€™s query scans more rows. TimescaleDB keeps it fast in Postgres. Get $1000 credit . Tiger Data (creators of TimescaleDB) sponsor The Website Specification: Every Technical Detail a Site Needs Before Launch โ€” A checklist you (or an agent) can work through before launch, covering SEO, accessibility, security, performance, privacy, i18n, and more. Joost de Valk browser-whisper 2.0: In-Browser Audio and Video Transcription with WebGPU โ€” A library that runs Whisper, Moonshine and other speech models entirely in the browser over WebGPU (with a WASM fallback), complete with timestamped segments, cached models and live mic input. Tanpreet Singh Jolly ๐Ÿ”Š UI SFX: A Library of 930+ Interface Sound Effects โ€” 78 UI sound cues (clicks, toggles, success, add-to-cart, loading loopsโ€ฆ) in 12 swappable styles, from minimal to arcade. A ~12KB runtime synthesizes them with Web Audio, or use the 936 CC0 MP3/Ogg files. Source code . Romain Simon MicroKit: 54 Copy-Paste React Microinteractions, CSS-First โ€” Free animated buttons, hover effects, tabs and inputs, each available in TS or JS and in plain CSS or Tailwind. About half need no dependencies, and they're the sort of little details that lift a UI. Henrique Barone ๐Ÿ“ฐ Classifieds ๐Ÿ“ฎ CraftForms : Hosted forms for any site, no backend needed. Two-line embed, unlimited submissions even on the free plan , no captcha. ๐Ÿงพ Add PDF editing to your app with Foxit's API : Merge, split, rotate, replace pages and flatten annotations, with working code. ๐ŸŒฟ ...and finally Overgrown: When Plants Invade Your Abandoned Tabs โ€” Leave a tab unread too long and this Chrome extension has vines grow across it, until you work your way back in with a machete, chainsaw or flamethrower(!). It's not on the Web Store, so load it unpacked from the repo . Charlie Gerard

Wednesday, 21 October 2026

  • Frontend FocusMulti Author Blogsread at source

    Ten CSS features worth voting for

    ๐Ÿš€ Frontend Focus #โ€‹763 โ€” October 21, 2026 | Read on the web Everyone's Interop 2027 Wishlists Last week we shared that you can now rank the Interop web platform proposals for 2027 . Since then, plenty of folks have shared their own rankings and explained their choices: โญ Josh Comeau's The Future of CSS โ€“ Josh's top ten, from CSS functions and corner-shape to anchored container queries and scroll-triggered animations, each with live demos, current browser support, and tips you can use today. A particularly good place to start. ๐Ÿ”Ž Sara Soueidan's picks put accessibility first. It's a privilege, she notes, that we get to influence what browser makers work on. focusgroup is her top pick. โœ๏ธ Declan Chidlow's 13 features โ€“ SVG improvements on top, followed by the CSS reading-flow and reading-order properties. ๐Ÿ“ More picks from Stuart Robson , Eric Meyer , Ana Rodrigues , and Tyler Sticka , and ๐Ÿฆ‹ this Bluesky thread has even more. Inspired to submit your own? Rank about ten proposals you'd like to see prioritized . The Firefox team says that's enough to provide useful input. Would You Let Your AI Agent Grade Its Own Homework? โ€” Agents write code faster than ever. They even review their own work. But whoโ€™s reviewing them? Dropbox, Notion & ElevenLabs donโ€™t take the risk. With Meticulous, every change is exhaustively verified, with zero developer effort. Meticulous sponsor ๐Ÿ—ณ๏ธ The State of HTML 2026 โ€” The annual survey returns to measure the awareness and adoption of HTML features and browser APIs. This year covers Web Components, progressive enhancement, AI, and more. It takes less than 15 minutes and you can learn new things just by taking it. Devographics Safari Blocks 'Identity Resolution' Tracking Infrastructure โ€” Cross-site cookies are long gone in Safari, so trackers moved to 'identity resolution' where third parties get the email address you type into forms and turn it into a cross-site, cross-device tracking ID. Safari now blocks them at the domain level. Wilander, Wolfe, and Finkel (WebKit) โšก๏ธ IN BRIEF โš ๏ธ If PHP runs anywhere behind your sites: PHP 8.5.12, 8.4.27, 8.3.36 and 8.2.35 fix two critical bugs that allow unauthenticated remote code execution. Update now, mod_php installs especially. ๐ŸŒ Chrome 157 is in beta with corner shorthands, a value for text-overflow , and anchor-valid . Chrome 156 went stable this week with CSS random() . ๐Ÿšซ Chrome has finished deprecating the unload event : handlers no longer fire by default, so use pagehide or visibilitychange instead. ๐Ÿ“™ Articles, Opinions & Tutorials JPEG XL vs AVIF for Web Use-Cases โ€” Now that JPEG XL has landed in all major browsers, Jake took the format for a spin, benchmarking it against AVIF. There's a lot of detail here with some good takeaways. You might also be surprised at what you can cram in under 200 bytes with JPEG XL. Jake Archibald Embracing Playful Imperfection with CSS's random() Function โ€” A look at how to approach adding some randomness into our projects, and whether it makes sense on the web. The demos here show off some ideas, like organic typography, bouncing letters, and splayed cards. Brecht De Ruyte Photorealistic 3D in the Browser Without the Rendering Overhead โ€” Learn how radiance fields and spatial streaming bridge real-time photorealistic 3D to the web with just 2 lines of Three.js. Miris sponsor Fitting an Element's Height to Its Background Pattern with calc-size() โ€” A repeating pattern cut off at the bottom is a classic annoyance. Ahmad uses calc-size() (Chromium only for now, Safari soon) with round() to snap an element's auto height to a multiple of the tile height. Ahmad Shadeed Core Web Vitals Now (Experimentally) Count Soft Navigations โ€” Most sites wonโ€™t notice, but navigation-heavy SPAs should see scores improve, with Search Console switching over when it goes stable next year. Annie Sullivan (Google) Using Math to Balance Your Heading Styles โ€” Craig outlines a simple system for styling heading levels using a modular scale. Craig Abbott โ–ถ Do We Really Need alpha() ? โ€” We now have three ways to lower the opacity of a color in CSS. Kevin has the details, highlighting what the alpha function brings to the table in particular. Kevin Powell WCAG 3: A Different Future for Accessibility โ€” Why binary pass/fail made WCAG 2 a ceiling, and how WCAG 3 aims to make conformance a floor. Lรฉonie Watson (TetraLogical) Compression and Concatenation on the Web โ€” A hands-on look at how gzip, brotli and zstd each cope with concatenation on the web. Phil Eaton Do Web Components Have a Future If Nobody is Writing Them? Nolan Lawson ๐Ÿงฐ Tools, Code & Resources ๐Ÿ“Š Chartist 2.0: This Lightweight SVG Charting Library Is Back โ€” A freshly modernized SVG charting library that you style with CSS. It originally popped up in 2014, but "went stale" . It's back with a composable API, server-side rendering, and still remains small. There's a migration guide for existing users. Gion Kunz et al. A DevTools Extension for Debugging CSS Scroll-Triggered Animations โ€” Adds a pane to Chrome DevTools that draws a scroll-triggered animation's activation and active ranges on a minimap, shows a live status light, and lets you edit the ranges in place. Chrome Web Store , or source here . Bramus Van Damme Mobile AI Infrastructure for Web Devs Who Code with Agents โ€” Point the agent you use for the web at iOS and Android. Expo takes care of the native builds and the trip to the stores. Expo sponsor Pele: Mermaid Diagrams as Lightweight, Themeable SVG โ€” A zero-dependency renderer for the Mermaid diagram syntax that outputs responsive SVG you can theme with CSS variables. It claims to be a sixth the size of Mermaid.js. You can try the playground here . Steph Ango (Obsidian) pour: A Free Accessibility Checker & WCAG Audit Tool โ€” Available as a browser extension or bookmarklet. Run it on any page to see an overlay with violations categorized as critical, serious, moderate, minor, etc. David Yarham ๐Ÿค– Lighthouse for Claude Code: Turn PageSpeed Audits into a CLAUDE.md Fix Plan โ€” Enter a URL and this tool will run a Google PageSpeed Insights and Lighthouse audit and generate instructions for Claude Code tailored to the audits. Baris Kocdur 3dsvg: The Easiest Way to Turn SVGs Into 3D โ€” A web-based editor that takes an uploaded SVG, text, or drawing and renders the flat image as 3D. Exports in a 3D software compatible format such as GLB, STL, etc. Renato Costa ๐Ÿ”ค A font that annotates itself Furifont: A Japanese Font That Draws Its Own Furigana โ€” Furigana, the small readings above kanji, usually mean using markup or JavaScript. Anthony's font does it with OpenType features alone! Repo here . Anthony Fu

Articles belong to their publishers. This site only collects what their feeds provide.

Updated 14 November 2026 at 14:01