If you often use CSS variables (custom properties),
you may have found the code referenced by
looks less shining or readable, particularly combined with
Not only because the expression is usually long,
the prefixed double hypens
-- also diminish the readability.
In css-doodle, I'm experimenting a way to eliminate all the visual noises while doing calculation to numerical variables.
To avoid conflicts with the native
I've introduced the symbol
$ as a replacement to
$() do not require the
just use the variable names directly:
One difference from
calc() is that the
$() function doesn't support values with units inside it.
0 if the input includes non-numeric variables or values.
Always returning a number is by design. However, if you want to attach a unit to the result,
put the unit right behind the symbol
$ or at the end of the function.
All the Math functions
can be used inside
Multiplication signs are sometimes optional like in Algebraic expressions:
When making references to variables, prefix the variable names with
as it is shorter compared to using
$ shares a common analogy in many programming languages,
which is why it's been chosen.
I previously shared this code of OpenAI logo at vis.social.
Now the readability of the code has improved with the help of