New color settings in themes

Themes

Empower your merchants to easily customize their online store with intuitive new color scheme settings. Online store color schemes are now available in developer preview.

You can define the structure of a color scheme in settings_schema.json and set values for each color scheme in settings_data.json. You can then reference the color schemes in the settings of a given section or block.

ColorSchemesDrop provides access to the colors schemes and color values in each scheme. You can define your CSS by iterating over the new drop. This way, merchants no longer need to edit their CSS or liquid file to add or remove color schemes.

Learn more about color scheme and color schemes settings.