CSS Mixins are ready for experimentation!

CSS Mixins and Functions are both ready for you to hack on 🤯. I think of functions as returning a value and mixins as a way to apply a chunk of styles. Bramus has a great intro on @function , don't miss it. But this post is about @mixin , don't miss the explainer , it is packed with valuable information: @mixin --box { aspect-ratio : 1; inline-size : 100px; block-size : 100px; } and using it: .box { @ apply --box; } Getting started # For CSS Mixins as of writing this, you'll need Canary and you'll need to launch it from the command line with this flag CSSMixins : open -a "Google Chrome Canary" --args --enable-features=CSSMixins Go make stuff! # You have all the latest information now: how to enable Canary to understand mixins what the basic syntax is like links to more advanced examples and documentation