Together with  Bit
🚀 Frontend Focus

#​693 — May 21, 2025 | Read on the web

The Latest from Google I/O

Google's annual I/O developer conference is taking place this week (if you see Peter say hi!) — and so far we've had sessions on AI, AI, AI, oh and some cloud, and Web platform stuff too. Here's what you need to know so far, and I imagine we'll have more to share next week too:


▶  Google I/O 2025: Developer Keynote — The main developer focused update from I/O (1 hour 10 mins) with updates and demos aplenty at how Google’s Gemini can help with web development (and more).
Josh Woodward and others

▶  What's New In Chrome & The Web — Here’s the livestream from the web stage at I/O. Skip to 29:50 for the What’s New in Chrome section with Paul Kinlan. Or seek ahead to the Web section with Rachel Andrew.
Paul Kinlan & Rachel Andrew

What's New in Web — In addition to the livestream above Rachel has also put together a blog with the biggest announcements — Baseline, CSS features, Core Web Vitals, and more.
Rachel Andrew

10 Updates From Google I/O 2025: CSS Carousels, AI-Powered DevTools, Prompt API with Multimodal Capabilities, and More
Kinlan, Gvak, Lee

Google’s Gemini AI Is Coming to Chrome
Jay Peters

Visual Studio Code Now Supports Baseline
Rick Viscomi

Build a Professional Design System in Less Than a Day Using AI — Instantly create and maintain your design system using prompts and images with new Hope AI model by Bit. Each component is ready for import and reuse as a package across new and existing projects.

Bit sponsor

'MCP is the Coming of Web 2.0 2.0' — Anil shares his thoughts on the emerging Model Context Protocol (a.k.a. MCP) — a way for LLMs to interact with apps and third party tools — highlighting its potential to revive an open, interoperable ‘Web 2.0’.

Anil Dash

The Future of the Web Depends on Getting This Right — Mozilla shares its take on the U.S. vs Google search case: “search competition must improve, but this can be done without harming browser competition”.

Mozilla

⚡️ IN BRIEF

📙 Articles, Opinions & Tutorials

Creating Blob Shapes using clip-path: shape() — Another cool tutorial from Temani, this time looking at how we can use the shape() function to create gooey, weird blob shapes that you can fill with a background image, and even animate.

Temani Afif

Accessibility in HTML Emails Remains Critically Under-addressed in 2025 — The Email Markup Consortium recently released a fresh study on accessibility in HTML emails, looking at over 400,000 emails. The takeaway? Well, there’s disappointment “to see the same issues as we have in previous years”, but a note that “frameworks and drag-and-drop tools are uniquely positioned to raise the accessibility baseline”.

Email Markup Consortium

Getting Started with Clerk Billing — Learn how to build a complete billing experience with Clerk and Stripe, no custom UI or webhooks required.

Clerk sponsor

▶  Unshipping: How (And When) to Break Web Features — A roughly ~50 minute podcast with Google’s Rick Byers about Blink’s ‘Principles of Web Compatibility’ and a willingness to change and even ‘unship’ web features.

Igalia podcast

CSS Snippets — Jeremy shares a handful of helpful little CSS tidbits and features that he often uses — you may want to drop them into your project too.

Jeremy Keith

Flipping Layouts When Google Translate Swaps between a Left-to-Right Language and a Right-to-Left Language — What’s the right approach here? Chris experiments with presenting his site when translated (to say Arabic) with a direction: rtl; property value set.

Chris Coyier

▶  Flexible Wrapping CSS Grid — Create a flexible CSS Grid with a varying number of items that expands, shrinks, and wraps to accommodate the number of items that can fit in one grid row. A quick CSS tip well explained in this ~4 minute video.

Zoran Jambor

"We Launched Our First Shopify Theme" — Sure, it’s an update about a new, paid theme, but it’s also an interesting blog post (with a rad design) about what goes into actually building such a thing.

Nic Chan

Finding the Joy in Alt Text — On the fun often found in the added context of alt text.

Bryn Newell

How to Convince People to Care and Invest in Accessibility
Stéphanie Walter

Three Tools to Help Fix the Web’s Most Common WCAG 2 Failures
Miranda Michalski

The Problem(s) with Image Accessibility
Oded Sharon

Building A Practical UX Strategy Framework
Paul Boag

🧰 Tools, Code & Resources

prompt-kit: A Set of Customizable, High-Quality Components Built for AI Applications — The components are built on shadcn/ui with the goal of making it easy to design AI-related interfaces like chat experiences, AI agents, autonomous assistants, and so forth. Repo here.

Julien Thibeaut

🎨 AI Color Match: Instantly Match Colors from Any Image — This tool lets you upload a source image (for the colors) and an output image. The colors from the source image are applied to the output and you can use a slider for before/after comparisons.

Polarr

🔐 Protect Your Stack from Over-Privileged AI Agents — WorkOS AuthKit enforces scoped OAuth access and RBAC—control what each agent or tool can access and do.

WorkOS sponsor

Web Code Tools: Code Generators for Frontend Development — Includes generators with live previews for CSS, HTML, JSON-LD, Meta Tags, Open Graph, X Cards, and Robots.txt.

Web Code Tools

Datastar: The Hypermedia Framework — Datastar claims to offer the power of Alpine.js and htmx in one smaller library. It embraces data-* HTML attributes (thus the name), signals, and SSE events, really embracing the hypermedia concept.

Star Federation

jsPad: A Modern Playground for Writing and Testing JavaScript, TypeScript, HTML, and CSS — Same idea as CodePen, JSFiddle, et al, and you can initiate a project via a template from a variety of technologies (JS, TS, React, Tailwind, Vue, Svelte, and even Web Components).

jsPad

Crosspost: A JavaScript Utility for Posting Across Multiple Social Networks at Once — Currently supports eight different services including Bluesky, X, Mastodon, LinkedIn, and others.

Nicholas C. Zakas

ColorPocket: A Chrome Extension for Organizing and Picking Colors — Has a simple set of features that includes an eyedropper, color picker, palette generator, and ability to save colors for later access.

Hugo Aracena

🪟 ...and finally

▶  Can Windows 95 Browse the Modern Internet in 2025? — A quick 10-minute curio. Yes, it’s possible with some noodling, but you’re not gonna have a good time. Unsurprisingly, a usable experience this is not.

Eric Parker

Ipx.