Enforcing customized fonts?

The fonts settings are only be applied to fonts that have not been set with a fonts CSS property in websites.

So technically you can do it, but it is per page, you can use the adblocker and the :style() rule to remove any font styling.

You write it like example.com##body:style(font-family: unset !important;) the problem is not all fonts are set in the body, like if you use it in community.brave.com##etc you will see some family-fonts are applied to other elements like h1

so in that case you would need to make a second rule with h1, instead of body or do an ‘all’ selector example.com##*:style() so all elements get injected the same family-font unset.

for multiple sites you can use commas to separate domains, example1.com,example2.com##*:style() so you don’t need to create multiple rules for that.
Brave supports entity in the cosmetic filters, so you can also use example.*## so it is applied to websites that have many mirrors.

Might improve in the future, first, brave doesn’t allow (for performance reasons) generic cosmetic rules = *##body:style() so they apply to all websites, second, Brave still doesn’t support procedural cosmetics, in that case there is a procedural called matches-css which will at least make it easier to inject css properties or modify or hide based on a css property match, so you can easily replace fonts that way, Arial replaces by comic sans and Poppins by time new roman, you just let the Adblocker search for them and apply the rules accordingly.

But for now that’s the way it works, not hard or complicated, but is it worth it?
using the * seems the easiest way even if each domain have to be set manually, but an extension will probably make things easier. But this Adblocker way works with Android, and it’s faster than an extension (I would guess so).

Also you apply the custom rules in brave://adblock because I forgot to say that important detail.

1 Like