Skip to main
Link
Trans flag generated by CSS-only function

CSS Custom Properties In The Cascade

a deep-dive into what’s possible

Pushing past the “variable” metaphor, CSS Custom Properties can provide new ways to balance context and isolation in our patterns and components.

See more at Smashing Magazine »

A deeper dive into the [CSS Custom Properties for Cascading Variables][vars] specification. Why are they called custom properties, how do they work in the cascade, and what else can we do with them?

  1. 12 Days of Web
    Link post type

    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 all Link posts
  2. 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
  3. 12 Days of Web
    Link post type

    Cascade Layers

    Giving us control over the cascade

    Don’t let specificity force you into strict selector conventions. Cascade Layers allow us to manage specificity without resorting to naming hacks or the !important flag.

    see all Link posts