v149 · CSS · PWA · Color

Manifest Accent Simulator

Chrome 149 scopes AccentColor to a PWA's theme_color. Pick a theme_color below and see how form controls styled with accent-color: AccentColor, accent-color: auto, and hardcoded hex each respond inside a simulated app window.

manifest.json — theme_color

Pick a theme color:

#1a73e8
{"theme_color": "#1a73e8"}
accent-color strategy:
accent-color: AccentColor — picks up app theme_color in Chrome 149 PWA standalone mode.
My App

Checkboxes & Radios

Range & Progress

when does scoping apply?

The scoping only activates when the web app runs in standalone mode (installed PWA). In a normal browser tab, AccentColor still reflects the OS accent. In this simulator, the app window above behaves as if it were standalone, so AccentColor is set to the chosen theme_color.

see also