Custom variable confusion

I'm trying to follow the docs on setting up custom variables for use in my theme's Twig templates. It seems pretty straightforward:

You can easily add custom variables in a variety of ways. If the variable is a site-wide variable, you can put the variable in your user/config/site.yaml file and then access it via: {{ site.my_variable }}

Going into user/config/site.yaml I add:
bright-color: ffff00
at the end of the file.

Then in my Twig template:
<div style="background-color: #{{ site.bright-color }};"

When the page displays, however, I look at the source and see:
<div style="background-color: #0;"

So clearly the variable is not getting evaluated correctly and put into the template.

I've also tried following the instructions here and put my variable definitions in user/config/themes/themename.yaml and tried accessing them via {{ grav.theme.config.bright-color }} and {{ config.theme.bright-color }}

None of this has worked. Is there something I'm overlooking, or is my syntax just broken somehow?

Hello @jimdoria

I think the - is not allowed in the header formatter for variables. Try bright_color instead of bright-color and it should work.

That did the trick! I remembered reading about that limitation in the docs somewhere, but didn't know to apply it here.

Thanks so much!