Docs menu ↓

Light, dark and system mode

Let shoppers switch your store between light and dark.

From version 1.0.6, Tradeline can show a small button in the header, on desktop and mobile, that switches your store between its normal colours and a dark mode. It is off by default.

1. Turn on Theme settings › Colors › Show a light, dark and system mode button.
2. Choose the Dark mode color scheme. Every section uses this scheme while dark mode is on, so pick one with a dark background and light text. Scheme 3 is dark in every Tradeline style and is the default.
3. Optional: add a Logo for dark mode under Theme settings › Logo and favicon. Use a light version of your logo so it stays visible on a dark background. Without it, your normal logo is shown. It replaces the logo in the header, footer, password page and age check.

The button cycles through three modes:

• System follows the shopper's device: a phone or computer set to dark shows dark mode. Every shopper starts here.
• Light always shows your normal colours.
• Dark always shows dark mode.

A shopper's choice is remembered on their device, and the page opens in that mode straight away, without flashing the other colours first.