An answer to a headscratcher Tyler Gaw (and Chris Coyier) ran into …
Tag Archives: custom properties
Computing
CSS Foundations: What is IACVT?
Creating Scroll-Triggered Animations by combining Scroll-Driven Animations, Custom Properties, Style Queries, and Transitions
Cyclic Dependency Space Toggles
The gotcha with @property
animating custom properties
@property
CSS Type Grinding: Casting Tokens (sm|md|etc
) into Useful Values (aka Style Queries without Style Queries thanks to @property)
My favorite use case for Style Queries is the ability to change a bunch of styles based on the value of a so called “higher-order variable”. You use that variable as a switch to change a bunch of properties. @container style(–theme: dark) { .card { background: royalblue; border-color: navy; color: white; } .card button { …
The Future of CSS: Variable Units, powered by Custom Properties
CSS Custom Properties and !important
Open Props — Supercharged CSS Variables
Adam Argyle released a new project named Open Props. Similar to the aforementioned Pollen, it’s a library that offers nothing but CSS Custom Properties. Open source CSS custom properties to help accelerate adaptive and consistent design. Available from a CDN or NPM, as CSS or Javascript. Once included, you can use the Custom Properties the …
On Using Custom Properties
On Twitter, John Allsopp recently shared that Flexbox is the greatest thing that happed to CSS. I quickly chimed in with my personal favourite. To me the single greatest addition to CSS over the past 20 years is Custom Properties. They’ve opened up a ton of possibilities, and make us CSS Authors way more productive. …