Inspect and manipulate the new CSS color formats in Sass!
CSS has a range of new color functions that support wider color gamuts (like display-p3) and perceptually uniform color adjustments (like oklch). Sass now provides additional tools for working with these new color formats, and converting between them.
If you want to learn more about CSS color spaces and the tradeoff they provide, or if you’re just interested in the new Sass functionality, I’ve written about it on the Sass Blog.
Some of the highlights:
color.space().color.to-space().color.to-gamut().color.adjust() or color.channel()
accept a $space parameter for making adjustments or inspecting
in an arbitrary color space.
One of the goals when writing CSS is to build component parts that will adapt well to different (and unexpected) contexts. Ideally, a component can be placed inside any “container” element without it feeling broken or out of place. How can you accomplish this in a complex layout like a…
As designers, it makes sense to think about what space is available in the browser, and adjust your typography accordingly. It’s also important to remember that different users will have different font-size needs – and the more a font size is responsive to the viewport, the less responsive it will…
Bringing SCSS flexibility to .sass files
The Sass indented format is getting more flexible with the ability to have multiline statements, semicolons, and more.