Extension is adopting the font of the website I go to

[Rory]

I am using a shadowroot to prevent the extension widget from adopting the stylesheet of the underlying website it opens over, however, it seems that certain elements of the website are leaking in.

I noticed today that whatever the main font of a website is appears to be replacing the font in my widget.

Does anyone know what might be causing this and how to prevent it?

[Rory]

Nevermind, found the solution. I had removed the body tag by accident from my widget so it was inheriting the body attributes of whatever the underlying site was.

[wOxxOm]

You can also sever the inheritance explicitly by adding CSS on the shadow root

:host { all: initial }

[Rory]

Thanks w0xx0m, very useful to know.