How does the color-scheme metadata affect document rendering?

The color-scheme metadata specifies compatible color schemes for the document.

It informs the browser about the color schemes the document supports, such as light or dark modes. This helps the browser render the document according to the user's preferences and device settings, ensuring a consistent and accessible visual experience.

<meta name="color-scheme" content="dark light">