Sass Indented Syntax Improvements
Bringing SCSS flexibility to .sass files
The Sass indented format is getting more flexible with the ability to have multiline statements, semicolons, and more.
Link
post type
Sass Color Spaces & Wide Gamut Colors
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:
- Sass colors have a ‘space’ that they are defined in.
We can inspect that using
color.space(). - A color’s space doesn’t change unless we explicitly convert between spaces
using
color.to-space(). - Out-of-gamut channels are also preserved
unless we explicitly adjust a color into a specific gamut
using
color.to-gamut(). - Color manipulation and inspection functions
like
color.adjust()orcolor.channel()accept a$spaceparameter for making adjustments or inspecting in an arbitrary color space.
Recent Links
Link post type5 Questions for Miriam Suzanne
I talked with Jens Oliver Meiert over at Frontend Dogma about our work here at OddBird, what’s happening in the CSS Working Group, and advice for getting started in frontend development.
Link post typeCSS @scope
Keep selector conflicts to a minimum
The new
@scoperule is here! It’s a better way to keep our component styles contained – without relying on third-party tools or extreme naming conventions.
