How can I exclude some tags from case settings?

How can I exclude some tags from case settings?

I have all tags in lower cases, like:

tags: ['food','vegan']

When I render them I capitalize with CSS, so they come out as: Food, Vegan

So far so good, that’s what I mainly want. But with a few tags I like to override that, examples: EV, BBQ

CSS can’t do that. Is there a Hugo way to achieve that? Or is it just write tags as they should appear later?

It will require a logic and a dictionary on which this will work. Better use VS Code and search for all words that you need to change with case sensitive and replace in bulk. That will be way quicker.

I have a similar approach on one of my sites - I store the tags as (mostly) lowercase, but every now and then I have something I want capitalised, so I store the tag in the frontmatter exactly how I want it displayed. Then, when I render the tags in my template I use a Hugo function (title) to capitalise, but because you can’t capitalise something that’s already in caps, my tags that I pre-capitalised are unaffected.

Here’s an example of the template (ignore the classes, they’re not relevant):

<div class="item-taglist">
        {{ range sort .Params.tags }}
        <span><a class="tag has-background-dark has-text-white" href="/tags/{{ lower . | urlize }}">{{ title . }}</a></span>&nbsp;
        {{ end }}

I think I will go with the “as they should show” method.

Thank you!