ContextQMD
Back to Vanilla Extract

createGlobalVar

site/docs/global-api/create-global-var.md

latest771 B
Original Source

createGlobalVar

Similar to createVar, createGlobalVar creates a global CSS variable reference:

ts
// vars.css.ts

import {
  createGlobalVar,
  style
} from '@vanilla-extract/css';

const opacityVar = createGlobalVar('opacity');

export const content = style({
  opacity: opacityVar
});

@property rules can also be created using createGlobalVar:

ts
// vars.css.ts

import {
  createGlobalVar,
  style
} from '@vanilla-extract/css';

const opacityVar = createGlobalVar('opacity', {
  syntax: '<number>',
  inherits: false,
  initialValue: '0.5'
});

export const content = style({
  opacity: opacityVar
});