Global Theme Options overwritten by Element Defaults

I have set up a custom stack so that I can create the fields I need because the default font manager did not have all the expected options I was hoping for. So far this is looking great as you can see from my screenshot below.

Now the problem is, any time an element has a field with the default value set to inherit this works perfectly (ie. font family, font size, etc.), but unfortunately anytime the element has its own default value it supersedes the global values I’m trying to manage here (ie. color, line-height, etc.).

Is there anyway around this? My client would really like to just set the typography in one place and have it enforced globally. If I try to elevate my stack’s CSS by adding important! then it makes the components values unusable and I don’t think that is a good practice either. Would be nice if I could just set the respective default values to by {{dc:theme:<keys>}}

Appreciate any help with this.

Hi Nicholas,

Thanks so much for reaching out.

Just to clarify, values set directly through Elements are designed to override the Global values. This provides more precise control, allowing you to customize individual elements as needed—without impacting your overall global design settings.

If you’d like an element to follow the global values, I’d recommend using the inherit option.

Hope it helps.
Thanks