|
|
![]() |
▶ 25 Rad CSS Features in 25 Minutes — In this energetic talk, Adam gives us a tour of the latest CSS features, including field sizing, custom scrollbar styling, math functions, scroll-driven animations, and more. The slidedeck is here, if you prefer to see the list, with code samples, sans video. Adam Argyle |
▶️ The above is one of many new talks shared from the recent Cascadia JS conference. You can see them all here. |
OpenAI’s AI-Fueled Browser, ChatGPT Atlas, is Here — Currently available on macOS only, with Windows and iOS/Android to follow, Atlas is a Chromium-based browser infused with OpenAI's take on what a hybrid chat/agent/web browser should look like. OpenAI |
![]() Ship Secure MCP Auth Without Relying on API Keys — API keys are hard to scope and break user flows. WorkOS Connect delivers a fully compliant OAuth 2.1 flow. It handles PKCE, scopes, user consent, and secure token issuance out of the box. WorkOS sponsor |
Masonry: Watching a CSS Feature Evolve — A high-level look at the evolution of the CSS Masonry feature, including how the proposals have evolved, and what we can learn from such developments of new CSS features. Saleh Mubashar |
|
📙 Articles, Opinions & Tutorials |
Making Context-Aware Components: How CSS Stuart Robson |
![]() The Two Button Problem — Knowing when a button is active should be inherently clear, but certain design trends means that’s not always the case. Chris attempts to clear up the ambiguity that such UI implementations present. Chris Coyier |
Build Your Apps Faster with a Ready-to-Use Backend — Forget about DevOps headaches. OneEntry gives frontend devs a ready-to-use cloud backend with built-in database, intuitive admin panel, and flexible data models that adapt to any project. OneEntry sponsor |
The Big Gotcha with Josh W. Comeau |
Conclusions After Using Signed Exchanges on My Site for 2 Years — Signed exchanges (SXG) is a Chrome-only Web delivery mechanism that enables authenticating the origin of a resource independently of how it was delivered, enabling privacy-preserving cross-origin prefetch. It's used by Google for serving up pages quicker to search users. This is a good summary of a technology that, sadly, seems unlikely to survive long term. Paweł Pokrywka |
What State ARIA In? — An explainer looking at ‘state’ or ‘selection’ attributes like Aditya Jainapur |
Anchor Positioning Updates for Fall 2025 — An overview of the current state of anchor positioning. James Stuckey Weber |
Are Your Retail Landing Pages Killing Conversions? — Things to keep in mind as we enter the busiest online shopping period of the year. Tammy Everts |
Improving the Trustworthiness of JavaScript on the Web — By way of WAICT (Web Application Integrity, Consistency, and Transparency), an early-stage W3C-backed effort.
|
Who Needs a Flying Car When You Have |
When to Use Modal vs Dialog Components
|
🧰 Tools, Code & Resources |
![]() |
Obra Icons: A Simple, Consistent Set of Icons for User Interfaces — Currently houses more than 1000 icons that you can download as SVG, PNG, or copy the code for use in React or Svelte. Test and customize color, weight, and size of the icons live on the page. Obra Studio |
⚡ Ship Powerful SCADA UIs with JointJS — Use our production-ready diagramming template and bring your industrial dashboards online in days, not weeks. JOINTJS sponsor |
Web Codegen Scorer: A Tool for Evaluating the Quality of LLM-Generated Web Code — If you're using code generation tools, this tool, from Google's Angular team, may be useful for comparing outputs by different models or monitoring quality over time. angular |
![]() |
JustGage 2.0: Draw and Animate Dashboard-Style SVG Gauges — A big release for a project started over a decade ago, now brought into the modern age and using native SVG APIs. The playground lets you play with the options and gauge styles. Bojan Djuricic |
Format JSON Online: A Complete Toolkit for JSON & Data Processing — Includes tools to do just about anything with JSON data along with some unique ones like AI-powered utilities for fixing and generating JSON and others for sharing and collaborating. Format JSON Online |
![]() |
Grayscale-Image-to-STL: Convert Any Grayscale Image into a 3D STL Model — A browser-based tool using Three.JS under the hood. You can try it directly here. Niche perhaps, but a good demo and useful for reliefs, height maps, 3D printing, etc. sysmaya |
ColorMate: Free Color Tools for Designers & Developers — Includes tools for generating color palettes, CSS gradients, and extracting colors from images. ready2up |