Bind CSS variable Svelte

Svelte

4/27/2022, 7:08:06 PM

by Leo Voon

CSS variables binding come in handy…

let value = 'green'
let text = '16px'

<div
  style:--bgColor={value}

/>

<!-- or -->

<div
  style="--text: {text}"

/>

<style>
  div {
    background-color: var(--bgColor);
    font-size: var(--text);
  }
</style>