Browser UI Theme Demo

This demo shows how color-scheme affects native UI like scrollbars and dropdowns. Use the switcher below to manually override the system preference.

Global Theme Controls

Global scrollbars adapt to the root scheme.

Nested Theme (Always Dark)

The dropdown and scrollbars in this section will always be dark.

Nested scrollbars stay dark.

Opt-out Example

This section uses color-scheme: only light to prevent automatic browser overrides even if the rest of the page is dark.