Custom callout title, remove bold

[govsat1]

I have a custom callout per the example below. It works fine, but I would like to remove the default bold formatting of the title.

I’ve tried font-style, font-variant, and font-weight in the title selector but nothing seems to remove the bold styling. Not sure what I’m missing. Any ideas? TIA

.callout[data-callout="links"] {
    --callout-color: 128, 128, 128;
    --callout-icon: lucide-external-link;
}
.callout[data-callout="links"] .callout-title {
    font-style: normal !important;
    font-variant: normal !important;
    font-weight: lighter !important;
}

[Sigrunixia]

Try .callout-title-inner instead.

.callout[data-callout="links"] .callout-title .callout-title-inner {
font-family: sans-serif;
font-weight: 400;

As a note, if you want a very thin font to try for this, try font-family: monospace;. Not all fonts have all weight and styling options.

[govsat1]

@Sigrunixia

.callout-title-inner

Thanks!

For anyone interested (I use this like a top nav bar on pages):

.callout[data-callout="links"] {
    --callout-color: 128, 128, 128;
    --callout-icon: lucide-external-link;
}

.callout[data-callout="links"] .callout-title .callout-title-inner {
    font-weight: inherit;
}

Use example: > [!links] [[Home]] | [[Projects]]

Looks like: