Issue #609

March 20, 2025

Our Interfaces Have Lost Their Senses

Amelia Wattenberger created a beautiful visual story to remind us that you should build UIs first and foremost for humans.

A Deep Dive into the Inline Background Overlap Problem

Ana Tudor explains how to get a semitransparent background following some inline text with padding without the overlap problem.

Jelly: Make Customer Support Simple & Sweet!

Keeping up with customer emails shouldn’t feel like flying a 747. Jelly makes it easy and affordable: one flat price per team, not per user. No surprise bills—just a simple shared inbox that helps your team respond faster, stay organized, and keep customer conversations flowing smoothly.

Try Jelly now for free and get 15% off!

CSS Weekly on YouTube

▶ Frontend News #12: New attr() Capabilities, CSS Variables in Shorthand Properties, Base64 Data URLs

Find out how you can use values from HTML attributes in CSS, why you should avoid custom properties in shorthand properties, how users with visual impairments perceive your colors, and more.

Watch video

Articles & Tutorials

Styling Counters in CSS

Juan Diego Rodríguez shows different approaches to style counters in CSS, going from the most basic ways to style lists directly in HTML to advanced customization techniques.

Style Legend

Jeremy Keith gives an overview of a new proposal for the ability to style a number of pseudo-elements of form controls.

Reducing CSS complexity with the :is() pseudo-class

Chris Ferdinandi shows you how :is() pseudo-class can dramatically reduce selector complexity.

Creating Animated Accordions with the Details Element and Modern CSS

Stefan Judis explains how to create animated accordions using only HTML and modern CSS with the details element, interpolate-size, transition-behavior, and the :has() pseudo-class.

:in-range pseudo-class

Kevin Powell shares a quick tip on how to use :in-range pseudo-class to style a ranged input element, with the styles only applying if the value is within the specified range.

HubSpot's Starter Bundle for Startups

Unlock the potential of your growing startup with HubSpot’s Starter Customer Platform.

For a discounted price of just $20/month, unlock access to the Starter edition of HubSpot’s six core products for marketing, sales, and customer service – powered by HubSpot’s Smart CRM – all for the price of one.

Built for startups like yours, HubSpot Starter has all the essential tools you need to scale.

Click here to claim your small business bundle and start growing your business today!

Tools

Accessibility Support

Accessibility Support is an online tool that lets you check if your code will work with assistive technologies. You can think of it as CainIUse for accessibility.

Check it out

Filter

Filter is a powerful, web-based image editor built with React and TypeScript. It provides a modern, intuitive interface for quick image edits and filters, optimized for both desktop and mobile devices.

Check it out