[Vuejs]-Can I use global constant in <style> section?

1👍

I believe you mean global CSS variables and yes you can but be mindful of browser support. If you’re using a pre-processor like SCSS, you can define and share variables too.

CSS Variables

:root {
  --color: red;
}

and your Vue component style block:

<style>
.some-class {
  color: var(--color);
}
</style>

An example with SCSS

SCSS Variables in a file for example: /assets/vars.scss

$color: red;

and your Vue component style block:

<style lang="scss">
@import "~/assets/vars.scss";

.some-class {
  color: $color;
}
</style>

Leave a comment