question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Use variable from simple vars inside color function?

See original GitHub issue

Right now we can’t do this – or at least I’m not sure what the syntax is do to this – since it’s not documented anywhere.

$green: #B0FFCF;
$darkGreen: color($green) darkness(10%));

Issue Analytics

  • State:closed
  • Created 8 years ago
  • Comments:14 (5 by maintainers)

github_iconTop GitHub Comments

1reaction
MoOxcommented, Jan 21, 2016

cssnext already provide color-function. So it’s indeed called before postcss-simple-vars. Use non standard stuff before cssnext please. Btw, cssnext also include autoprefixer.

0reactions
maggibencommented, Dec 10, 2017

@MoOx answer is the correct one, postcss-simple-vars must be placed before postcss-cssnext

Read more comments on GitHub >

github_iconTop Results From Across the Web

How to use variable variables in LESS with colors stored in ...
The solution is simple. Just use @@ instead of @ for the color. The color will then get parsed properly, and become an...
Read more >
Using CSS custom properties (variables) - MDN Web Docs
They are set using custom property notation (e.g., --main-color: black; ) and are accessed using the var() function (e.g., color: var(--main- ...
Read more >
CSS Variables - The var() function - W3Schools
The var() function is used to insert the value of a CSS variable. CSS variables have access to the DOM, which means that...
Read more >
How to use variables in CSS - SitePoint
Learn how to use CSS variables (custom properties) to make it easier to manage colors, fonts, size, and animations, consistently across web ...
Read more >
CSS Variables Definition – What are CSS Vars and How to ...
If you want to access that variable, then you would use the var() function. Here is the basic syntax. css property: var(--css-variable-name) ...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found