Currying in CSS? | Trys Mudford

I don’t understand what currying is, but Trys points out a really interesting thing about custom properties in CSS:

The value after the : in the CSS custom property does not have to be valid CSS.

That means you can use custom properties to store arbitrary strings of text, which can then be combined within a calc() function, at which point they get evaluated.

Currying in CSS? | Trys Mudford

Tagged with

Related links

Tagged with

Offloading JavaScript With Custom Properties: HeydonWorks

With classes, we can send CSS static values but with custom properties we can send dynamic ones, which is a major shift in the way we can style state. This is something that has been true for some time—and is extremely well supported—but sometimes it takes solving a small real-world problem to make you appreciate the value of it.

I think we still haven’t come to fully appreciate the superpower of custom properties: dynamic values that are shared between CSS and JavaScript.

Tagged with

Clamp calculator | Utopia

Oh, this is a nice addition to the Utopia set of tools: when you don’t need a full-on type scale but you still want to figure out fluid clamp() values, the clamp calculator has you covered.

It’s got permalinks too!

Tagged with

Some simple ways to make content look good - Set Studio

This is a terrific walkthrough from Andy showing how smart fundamentals in your CSS can give you a beautiful readable document without much work.

Tagged with

Min-Max-Value Interpolation

Here’s a really nice little tool inspired by Utopia for generating one-off clamp() values for fluid type or spacing.

Tagged with

Related posts

Declarative design

Defining the inputs instead of trying to control the outputs.

CSS for all

Whatever happened to Mozilla’s stated policy of restricting new CSS properties to HTTPS?

Inlining SVG background images in CSS with custom properties

A clever technique I learned from Trys.

Making the Patterns Day website

The joy of getting hands-on with HTML and CSS.

Utopia

Why do I like fluid responsive typography? Let me count the ways…