Skip to main
Link
12 Days of Web

CSS @scope

Keep selector conflicts to a minimum

The new @scope rule is here! It’s a better way to keep our component styles contained – without relying on third-party tools or extreme naming conventions.

See more at 12 Days of Web »

Scoped styles have always been the primary goal of CSS. Selectors scope declarations to matched elements. Those selectors can be combined to create more specific scopes – each modified by its relation to others. But the @scope feature, already available in Chromium browsers, will make that functionality even more powerful.

  1. Sass logo in black
on top of bright oklch color gradient
    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.

    see all Link posts
  2. FD logo repeated on a red background
    Link post type

    5 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.

    see all Link posts
  3. A close up of the hands of a person handing a package
to another person.
    Link post type

    Sass Package Importer (Request for Comments)

    A new proposal for importing from NPM packages in Sass

    UI libraries like Vuetify and Bootstrap make it easy to extend their themes by providing Sass source files with their NPM packages. Now, Sass is requesting feedback on a simpler way to import those libraries into your Sass styles with e.g. @use "pkg:bootstrap".

    see all Link posts