<p>--color:blue</p>
<section>--color:#bad</section>
<aside>--color: yellow</aside>
    p {
        --color: blue;
    }

    section {
        --color: #bad;
    }

    aside {
        --color: yellow;
    }

    :root {
        --color: teal;
    }

    p:before {
        --color: red;
    }

p {
  color: var(--color);
}
p:before {
  content: ':before element: --color: red;';
  color: var(--color);
}

section {
  color: var(--color);
}

aside {
  color: var(--color)
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.