Realize Theme Styles Settings

General Styles settings

With Realize, you can customize styles of all modules based on your requirements.

In the Section styles tab of each module, you can set up all the necessary options.

Vertical paddings

You can customize size of internal vertical paddings for each module from the edge of the section to the content. The allowed values: Extra large, Large, Medium, Small, None.

Alignment

In the Styles tab, you can choose the alignment of the module’s content:

• 4 horizontal alignments: left, right, centered, justify;
• 3 vertical alignments: top, center, and bottom.

Background

You can set a color or an image as a background:

• 6 colors, selected in theme settings: Light, Dark, Secondary 1, Secondary 2, Primary 1, Primary 2;
• Transparent – the color of the section with a custom module;
• Any image.
  
  

When you choose an image as a background, you can customize:

• The image size – full size or customize its size based on your requirements;
• Horizontal and vertical alignments.

When the background is selected, you can add a mask effect: Light or Dark. It adds an overlay on top of the background, which helps to make the text sharper.

Example of the mask Light effect.

Colors

In color settings, you can select a text color (Light or Dark) and an accent color (Primary 1, Primary 2, Light or Dark). These colors are specified in the theme settings based on your brand colors.

Next module background

It is similar to the module’s background color. You can specify the color of the next module background.

Tick Merge with next section to merge the current section with the next one.

Module visibility

In the Module visibility tab, you can customize the visibility. Here, you can restrict the custom module visibility on selected devices: mobile, tablet, or desktop. It adds flexibility to your content.