How can I add CSS variables to the HTML head?
To do this from hook_preprocess_html like in accepted answer to the duplicate question it works like in the snippet below.
/**
 * Implements hook_preprocess_HOOK().
 */
function MYMODULE_preprocess_html(&amp;$variables) {
  $style = [
    '#tag' =&gt; 'style',
    '#value' =&gt; &quot;:root {\n  --test-var: pink;\n}&quot;,
  ];
  $variables['page']['#attached']['html_head'][] = [$style, 'foobar-my-id'];
}