prefers-color-scheme: начална тема според системата

Полезно е да знаеш

С медия заявката prefers-color-scheme сайтът може да отчете предпочитана светла или тъмна цветова схема. Примерът @media (prefers-color-scheme: dark) прилага определени стилове, когато е заявена тъмна схема. Това е предпочитание за представяне, а не информация за осветлението в стаята. [1]

Практичен подход е да определиш цветови променливи за фон, текст, рамки и връзки, а в заявката да смениш стойностите им. Така една и съща структура може да получи различна палитра, без да се копира целият CSS.

Провери формулярите, логото, снимките и състоянията на фокус и в двете схеми. Инвертирането на цветовете на цялата страница рядко е достатъчно за последователен резултат. Ако има собствен бутон за тема, избраният от човека режим трябва да има ясна връзка със системното предпочитание, вместо двете настройки да се борят помежду си.