Colors and color schemes

Radian colors work with color schemes. A scheme is a set of colors for the background, text, buttons, borders, prices and more. Each section picks a scheme, so a change to a scheme updates every section that uses it.

How to set it up

Step 1: Open the color schemes

1. Go to Theme settings > Colors.
2. Click a scheme to edit it, or Add scheme to create a new one.

Step 2: Edit the scheme colors

1. Background and Background gradient: the section background. A gradient replaces the solid color when set.
2. Text, Muted text and Notice text: body text, secondary text and notices.
3. Button, Button label and Secondary button label: primary buttons and outline buttons.
4. Border, Shadow, Surface and Strong surface: lines, shadows and the panels inside cards and drawers.
5. Accent, Price, Product grid price, Save price and Cart dot: highlights, prices on product pages and in grids, the saving amount, and the cart badge.

Step 3: Use a scheme

1. Select any section and pick a Color scheme under Color. Drawers such as the Cart drawer and Menu drawer have their own scheme setting too.

How it works

• Some sections add extra color settings on top of the scheme, for example overlay color on Image banner or Hotspot color on Shop the look.
• Product badges use their own colors from Theme settings > Product badges, not the section scheme.

Related

• Section layout and spacing
• Typography
• Product badges