Tags: variables

7

sparkline

Tuesday, August 21st, 2018

A Tale of Two Buttons

In defence of the cascade (especially now that we’ve got CSS custom properties).

I think embracing CSS’s cascade can be a great way to encourage consistency and simplicity in UIs. Rather than every new component being a free for all, it trains both designers and developers to think in terms of aligning with and re-using what they already have.

Remember, every time you set a property in CSS you are in fact overriding something (even if it’s just the default user agent styles). In other words, CSS code is mostly expressing exceptions to a default design.

Tuesday, May 29th, 2018

Dark theme in a day – Marcin Wichary – Medium

On Ev’s blog, Marcin goes into great detail on theming an interface using CSS custom properties, SVG, HSL, and a smattering of CSS filters.

I was kind of amazed that all of this could happen via CSS and CSS alone: the colours, the transitions, the vectors, and even the images.

Saturday, May 19th, 2018

Super-powered layouts with CSS Variables + CSS Grid by Michelle Barker on CodePen

This article is about using custom properties and CSS grid together, but I think my favourite part is this description of how custom properties differ from the kind of variables you get from a preprocessor:

If you’re familiar with Javascript, I like to think of the difference between preprocessor variables and CSS Variables as similar to the difference between const and let - they both serve different purposes.

Friday, September 22nd, 2017

Thursday, June 22nd, 2017

Using CSS variables correctly - Mike Riethmuller

Mike examines the real power of CSS custom properties compared to Sass variables—they can change at runtime.

I’m convinced that in almost all cases, responsive design logic should now be contained in variables. There is a strong argument too, that when changing any value, whether in a media query or an element scope, it belongs in a variable. If it changes, it is by definition a variable and this logic should be separated from design.

Tuesday, October 11th, 2016

Pragmatic, Practical, and Progressive Theming with Custom Properties by Harry Roberts

Harry demonstrates a really good use for CSS custom properties—allowing users to theme an interface.

Thursday, December 19th, 2013

About Variables in CSS and Abstractions in Web Languages | CSS-Tricks

Chris has a written a response to my post (which was itself inspired by his excellent An Event Apart presentation) all about CSS, variables, and abstractions.

I love this kind of old-school blog-to-blog discussion.