Determine browser's default text highlight color using JavaScript or Dart

The browser's default text highlight (selection) background color can be overridden, e.g.:

::selection {
  background: #ffb7b7;

And the color is browser/OS specific. Is there a way to read the browser's default value using JavaScript or Dart?



I would say that you can't.

Both getComputedStyle(yourElement, '::selection').backgroundColor and getComputedStyle(yourElement, '::-moz-selection').backgroundColor will return transparent as default value and browser won't override os's default.
(Worth to be mentioned that if you set it to transparent, default os' value will be overriden).

I don't think browsers have access to os default preferences, and if they do, they probably won't let any website access it it so easily.


As described at, you can use CSS system colors:, although they are deprecated, they do work.


Recent Questions

Top Questions

Home Tags Terms of Service Privacy Policy DMCA Contact Us

©2020 All rights reserved.