JSFiddle - React, Tailwind, and code Playground

HTML

<div class="test" style="--color: #000"></div>

SCSS

.test {
  padding: 40px;
  &::before {
    content: '';
    border: 2px solid var(--color);
    width: 100%;
    display: block;
  }
}