Issue 320
CSS mix-blend-mode and clip-path, the W3C design system, flexible components, and my job news!
I'll start this week with some personal news, which, if you follow me on Twitter, you may already know. After 20 years of self-employment (aka refusing to have a proper job), I've accepted a new role at Google. I'll be working on web.dev, and I am really excited about all the great content I can help folk create for the web development community as part of a bigger team.
This newsletter will continue, however! At 320 weekly issues, it would be a terrible shame to break the chain now, so while there is layout news to share, I'll keep posting it.
News
The W3C Design System is live
You can find it at design-system.w3.org, as explained in the intro the system has been heavily influenced by Andy Bell's CUBE CSS and Every Layout also from Andy with Heydon Pickering.
Inclusive Design 24
The free, 24-hour, online event celebrating inclusive design is back on 23rd September.
Learn
Grainy Gradients
Here is a nice CSS tutorial demonstrating how to add noise to a gradient using properties such as mix-blend-mode
along with SVG, and filters.
Typography for Data
A good look at how to use typography to help in making data-heavy operational product designs look great, and be easy to read and understand.
Styling CSS checkbox states
A rundown of different ways to style checkboxes.
Developer Decisions for Building Flexible Components
A piece about the things to consider when developing components from Michelle Barker.
The Story Behind TryShape, a Showcase for the CSS clip-path property
This post details the creation of TryShape — an app that helps you create shapes using CSS clip-path
and then share them.
Our sponsor
Explore the intersection of accessibility, usability, and inclusion
Inclusion and diversity are two of the most important themes in today’s world. As UX and front-end experts, it’s our responsibility to actively explore how our work impacts all users, not just an idealized average.
An Event Apart Online Together: Fall Summit 2021 features essential sessions from Derek Featherstone, Regine Gilbert, Melanie Richards, Sara Soueidan, and David Dylan Thomas to help you get started. Join us online October 11–13.
CSS Layout subscribers can save $100 off any multi-day pass with promo code: AEACSSL21
CSS Layout News Newsletter
Join the newsletter to receive the latest updates in your inbox.