When to Nest CSS — CSS nesting is great, but Scott notes it should be used with some caution. The complex answer given here to the question of just when to deploy it is to “nest pseudo-selectors, parent modifiers, media queries, and selectors that don’t work without nesting”.

Scott Vandehey

Five Best Practices for Preventing Chaos in Tailwind CSS — Tailwind CSS is a very popular CSS framework, but Nina notes how using it without proper caution can add “mayhem to your code”. Here, she shares some best practices to ensure you ‘stay aloft’ when using it.

Nina Torgunakova

Online Frontend Developer Bootcamp 20% Off for Frontend Focus Readers — Launch your career in less than 6 months! If you struggle with impostor syndrome or staying motivated, this self-paced online Bootcamp is for you. Get code reviews and accountability, live group sessions, hands-on support and expand your network.

Scrimba sponsor

Demystifying WCAG 2.2 — The W3C recently released the newest version of the Web Content Accessibility Guidelines. Nathan breaks down the headlines from WCAG 2.2 for us. Adrian Roselli brings together some other good related resources and links here.

Nathan Schmidt

Chrome's New Origin Trial for Fullscreen Popup Windows — There’s now a new origin trial available in Chrome for opening popup windows in fullscreen mode with just one step.

Thomas Steiner (Chrome)

The Future of CSS: Easy Light-Dark Mode Color Switching with light-dark() — Bramus shares a look at this new utility function (part of the draft CSS Color Module Level 5) that either computes to the first color if the used color scheme is light or unknown, or to the second color if the used color scheme is dark.

Bramus Van Damme

Add Figma Like Collaborative Features in a Few Lines of Code — Create collaborative features, from live cursors to avatar stacks with Spaces, our in-app collaboration SDK.

Ably sponsor

Being Picky About a CSS Reset for Fun & Pleasure — We recently shared Andy Bell’s new take on a modern CSS reset, now Chris Coyier has decided to go through it line-by-line and offer his subjective take on it.

Chris Coyier

Can Browser Choice Screens Be Effective? — Some research (admittedly from Firefox maker Mozilla themselves) that highlights the critical importance design plays when making an effective 'browser choice' screen, a feature set to be ‘back on the menu’ following EU legislation set to come into force next year.

Mozilla Research

Safari's Simplified Responsive Design Mode — The responsive design testing tools in Apple’s browser have been updated.

Jon Davis (WebKit)

CDNs: Speed Up Performance by Reducing Latency — This post is from a few months ago now, but we missed it at the time, so maybe you did too. It covers what CDNs are, how they work, and why you need one. Austin also shows us how to connect one such CDN from Akamai to Object Storage.

Austin Gil

autocomp.js: A Tiny JavaScript Autocomplete Library — A really simple solution that can easily be styled with CSS and weighs in at ~800 bytes minified and gzipped. Try out two variations on this demo page.

Kailash Nadh

Lite YouTube Embed 0.3: A Faster Youtube Embed — Faster than the official one, at least. v0.3 implements reliable autoplay. There’s a live demo here.

Paul Irish

Hire Vetted Developers in US Time Zones, Fast — Get matched with vetted candidates in 3 days and receive a $2,500 credit on first hire. Start with a risk-free trial!

Revelo sponsor

Durves: A Tool for Creating and Exporting Dot Patterns for Graphic Designers — This lets you generate PNG or SVG pattern of points through various properties (matrix, dot radius, etc.), to generate a base grid for creating a graphic design project, UI/UX, etc.

Filipe Esteves

Gradient Designer: A Visual Tool to Create/Customize Gradients Using Modern Features — This tool lets you choose modern color spaces (sRGB, Oklab, etc.) after which you can export the gradient as CSS, SVG, JSON, or JavaScript.

Aarni Koskela

CSS Box Shadows Generator: An Online Tool to Edit and Generate Code for Layered Box Shadows

CSS Box Shadows Generator