Themes: what the auto light dark website theme options actually do

What Auto means here

On many sites and apps, auto means "match the device": dark if the visitor's phone is in dark mode, light otherwise. In Anticode's builder it means something narrower, and it's worth knowing before you publish. The auto light dark website theme setting tells the design engine to use the design system's own home palette, the one it was designed around. That palette is the same for every visitor, at any time of day, on any device.

So if you chose Technical or Luxury and left the theme on Auto, the site is dark; that's the system working as designed, not a fault.

What Light and Dark change

Light and Dark switch to the design system's other palette without changing anything else. The typeface, radii, rules, spacing, headline size and section order stay exactly as they were. What moves is the set of colour tokens:

• Background, surface and text swap to the other palette's values, with the muted text and line colours tuned to match.
• The action colour switches to the shade made for that background. Each of the eight action colours has a deeper shade for light palettes and a brighter one for dark.
• Button text switches with the palette: a light tone on light palettes and the background colour on dark ones.
• Form error colour changes too: a deeper red on light pages and a softer one on dark, so an invalid field is visible either way.
• The browser's own controls are told which scheme the page uses, so built-in form controls and scrollbars match it rather than flashing white on a dark site.

How to switch

1. Turn on Edit in the builder. The inspector has a Theme control with three options: Auto, Light and Dark.
2. Pick one. The page rebuilds with the other palette straight away.
3. Or write the change: a request containing "dark" or "light", such as "make it dark", is understood in your browser as a quick change. To go back to Auto, use the inspector.
4. Check the photos. A bright photograph that sat well on cream may look harsh on near-black, and the reverse.

Theme changes never use your build allowance. They do clear any colours you set by hand in the code editor, because those were chosen against the previous palette, so set exact brand colours after you've settled on a theme.

Choosing between light and dark

Neither is better in general. Dark suits businesses that live in the evening (bars, cinemas, music venues, saunas), products whose interface is itself dark, and photography that needs to glow. Light suits long reading, menus and price lists, healthcare and anything printed or shared as screenshots, and it tends to be easier to read on a bright phone screen outdoors. The light or dark website background guide goes further, and dark mode website design covers the pitfalls of dark palettes.

Limits

• No device matching. Auto doesn't follow the visitor's system setting, and there's no option that does.
• No visitor toggle. Published design-engine pages run no scripts, so there's no switch for visitors to flip between palettes.
• One palette per site. Every page of a multi-page site uses the same theme.
• Only the system's two palettes. A third palette means editing colour tokens in the code editor in Pro mode, which a later theme change resets.

Questions people ask

Does Auto follow my visitor's dark mode?

No. Auto uses the design system's own palette for everyone. Choose Light or Dark to fix it the other way.

Why is my site dark on Auto?

Technical and Luxury are designed dark, so Auto gives their dark palette. Choose Light under Theme if you want the light version.

Will a theme change move my sections or text?

No. Only colours change. Your words, section order, layout edits and features stay as they were.

Can visitors switch between light and dark?

Not on published design-engine pages, which run no scripts. Every visitor sees the theme you chose.