Very Early Playing with random() in CSS
(Only Safari Technical Preview!)
Awfully cool `random()` is coming in CSS. The design possibilities are quite cool.
(Only Safari Technical Preview!)
Awfully cool `random()` is coming in CSS. The design possibilities are quite cool.
All the browsers DevTools have a way of emulating color modes. The are essentially faking the system preference at the application level. Here’s where those controls are located and another nice tool.
An underdog media query, resolution queries, comes to the rescue here in defining radial gradients that don’t blur or get the jaggies.
The web platform has a heaping helping of more design capability built into it than any design software does.
CSS module scripts help keep the dream of co-locating files that all relate to a component, without needing a bundler.
You can get your hands on ranges of text in JavaScript, then apply a named “highlight” on them, so you can style that range in CSS with no other selector necessary.
The whole point of auto-fit and auto-fill is that you aren’t saying how many columns to use. But if you knew how many the browser chose, you can make nice design decisions.
A row of logos that animate forever perfectly and don’t have any duplicated HTML or JavaScript at all is quite a trick. Thanks modern CSS!
Best bet: just always use them.
More nuanced take: there is a few situations where using the physical property is still releavant.
It’s a complicated look! There may or may not be blurring, light refracts in tricky ways, the highlights are quite bright, and you’ve got to be very careful about text contrast accessibility.
Frontend Masters donates to open source projects through thanks.dev and Open Collective, as well as donates to non-profits like The Last Mile, Annie Canons, and Vets Who Code.