How to create a dynamic favicon (which is depending on the browser color)?

Question

I added a favicon to my website, but the favicon is black, and can not seen for example in Mozilla FF dark mode. How can I (using JS or HTML) detect the browser Color?

Answer 1

It is not possible to get the color of the browser. The only possibility is to detect if the browser is in dark mode or not.

Solutions for that case are shown under Is it possible to use a different favicon for browsers that support theme-color? and Detect if the browser is using dark mode and use a different favicon, but there is no way of getting the browser tabs color.