Using Colour Schemes To Create Light And Dark Modes In CSS
… based on the current colour scheme. .some-class { background-image: url(../images/icon-link-light.svg); } @media (prefers-color-scheme: dark) { .some-class { background-image: url(../images/icon-link-dark.svg); } } Using this mechanism you can … none; border: none; span::before { content: ""; background-image: url(../images/icons/sun.svg); width: 25px; display: block; height: …