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.
Related links
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.
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!
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.
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.
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…