Chris’ Corner: PerformanCSS – CodePen

CSS Custom Functions are coming … and they are going to be a game changer!

Chrome is currently prototyping CSS Functions, which is very exciting!

Sharing a Variable Across HTML, CSS, and JavaScript – Frontend Masters Boost

Set a variable in Pug, then create an inline script which sets that variable for using in JavaScript and use setProperty to pass it to CSS.

Benchmarking the performance of CSS @property  |  Articles  |  web.dev

What impact does @property have on the performance of your CSS?

How I build a button component

A button is arguably the most likely component to find itself in your codebase so I’m going to show you how I approach building one.

Split Effects with no Content Duplication – Frontend Masters Blog

The `clip-path` property with the `inset()` shape makes for some cool design opportunities. Here we'll expand on some existing ideas, improving them by not requiring any content duplication.

CSS @property and the New Style

An exploration of the newly supported at-rule for explicitly defining and animating custom properties in CSS.

Captured Custom Properties

In a few of my latest CSS experiments and articles, I used one naming pattern for registered custom properties that I think worth highlighting in a separate blog post. This pattern allows us to create a set of generic custom properties, covering a wide set of use cases for computing and storing their values.

Relative Color Syntax — Basic Use Cases – Frontend Masters Boost

Support for the relative color syntax in CSS is across the board now (go interop!), so here we look at some basic (and still very useful) use cases, like applying alpha to a color you have on hand.

Have It All: External, Styleable, & Scalable SVG | Scott Jehl, Web Designer/Developer

Let's revisit an ideal SVG embedding approach.