How set set color in Global theme style

Overview

In this article we will guide you to setup Color in global theme style to have a consistent style in all pages.

How to use Colors?

By default, Color will have 3 Schemes and 1 option set for Other colors. You can click Add Scheme to create your own Scheme.

[ Screenshot ]

What's in a Scheme?

The settings of a Scheme include color configurations divided into two parts:

  1. Section color.

  2. Button color.

[ Screenshot ]

1. Section colors:

The basic colors of a section include: Background, Heading text and Body text.

[ Screenshot ]

2. Button colors:

Button color has two states:

Normal:

  • Background – the button’s background color

  • Label – the text color

  • Outline – the outline color of the button

[ Screenshot ]

Hover:

  • Background tone – adds a color layer on top of the button background

  • Label – adds a color layer on top of the text

  • Outline – adds a color layer on top of the outline

[ Screenshot ]

Dragging the slider to the left applies a white tone layer, while dragging to the right applies a black tone layer. The further you move the slider toward either side, the less transparent the tone layer becomes.

How to change color in Scheme?

You can change a color using the color picker or by entering a Hex color code.

[ Screenshot ]

We hope this article helps you understand how to use Color in Global Theme style to set consistent colors for your theme.

Have a question?

Contact us via in-app live chat. We'll reply in few minutes.

Last updated