A Global Design System

This is a call to action to create a Global Design System that provides the world’s web designers & developers a library of common UI components. A Global Design System would improve the quality and accessibility of the world’s web experiences, save the world’s web designers and developers millions of hours, and make better use of our collective human potential.

Arguments for opening links in a new tab or window

After nearly two decades of debating this practice, you’d expect to find a few case studies or academic papers supporting the approach. But I’ve searched extensively and I can’t even find any anecdotes that support this practice.

What is safe alignment in CSS?

The value safe is essentially saying “don’t let the alignment force a situation where the content is positioned off the screen where a user can’t scroll to it”. Content that is pushed off the screen in a way a user can’t scroll to it (think off the top or left of a browser window, or any element with scrolling overflow) is called data loss.

Creating color palettes with the CSS color-mix() function

We’ve seen how to use color-mix() to create variations of colors, and how the function can be used in combination with custom properties for use in projects and design systems. With browser support already pretty great, we can look forward to a new era of working with color on the web!

Add Superpowers to Your CSS Variables with Style Queries

We’re on the verge of yet another CSS revolution with the arrival of style queries. If you’ve ever thought: 'Yeah, variables are cool and all, but it’s a bummer I can only use them to set one property at a time,' or, 'Wow, I wish I could style this whole layout differently based on a CSS variable I set with a media query,' then your dreams are about to come true!