Skip to main content

Harshal V. LADHE

The CSS color-scheme Property

How `color-scheme` tells the browser which themes a page supports and unlocks theme-aware features like `light-dark()`.

Content tagged color-scheme

  • Tutorial:One-Line Theme-Aware Colors with light-dark()

    A single declaration per color, resolved automatically for both light and dark mode.
    The light-dark() CSS function collapses a light value and a dark value into one declaration, resolved by color-scheme — no duplicate custom properties, no @media (prefers-color-scheme) block per themed property.
    Published at:
    Categories:CSS
    Estimated reading time:3 min read