React useCSSVar (--*)

Const useCssVar

• useCssVar(propertyName: string, element?: HTMLElement): [TGetter, TSetter] | undefined

• Custom hook to interface with CSS custom properties.

  const [get, set] = useCssVar('--color-bg')
  
  get() // 'papayawhip'
  
  set('rebeccapurple')

  Parameters

  • propertyName: string

    Name of CSS property.

  • Default value element: HTMLElement = document.documentElement

    DOM element on which the CSS property will be looked up/set on.

  Returns [TGetter, TSetter] | undefined

  Tuple with a getter and setter.