<!DOCTYPE html> <style> div#a { --foo: purple } div#b { --foo: blue } p { background-color: var(--foo) } </style> <div id="a"><p>This should be purple.</p></div> <div id="b"><p>This should be blue.</p></div>