How to Implement the Modern Skin

In order to have the modern skin implemented, you will need to carry out the following steps:

1.Navigate to the Appearance > Theme Settings > General Options

2. Select the “Modern Skin”

3. Navigate to the Theme Settings > Login/Register tab

4. Enable the custom login and specify the background color

The background color needs to be set to the color code #fff4ee.

5. Navigate to the Theme Settings > Menu section

6. Specify the menu options as illustrated in the screenshot below

Basically the key aspects are as follows:

BACKGROUND COLOR :: #ffffff

MENU WIDTH :: 180

MENU COLOR #2 :: #65676d

MENU HOVER COLOR :: #fff4ef

7. Navigate to the Theme Settings > Title Box section

8. Specify the Title Box colors as illustrated in the screenshot below:

The key aspects are as follows:

HEADLINE COLOR :: #1e2538

LAYER COLOR :: #fff4ee

BORDER COLOR :: #fd7a38

9. Navigate to the Theme Settings > Footer & Extra Footer

10. Specify the respective footer colors as illustrated below:

The core color changes include:

TEXT COLOR ::#1e2538

LINK COLOR :: #1e2538

WIDGETS BACKGROUND COLOR :: #ffffff

COPYRIGHT BACKGROUND COLOR :: #ffffff

11. Navigate to the Theme Settings > Styling section

12. Specify the font options as illustrated below:

The main font and headlines font should be set to a font size of 14px, font weight of 100 and the font family should be Poppins.

13. Specify the Color options as illustrated below:

The main color changes include:

MAIN COLOR :: #fd7a38

MAIN TEXT COLOR :: #3c3f4d

HEADLINES COLOR :: #3c3f4d

BODY BACKGROUND COLOR :: #f7f6f4

LIGHT COLOR #1 :: #f0f0f6

LIGHT COLOR #2 :: #f9f9fc

LIGHT COLOR #3 :: #9e9e9e

14. Save your Changes

15. Navigate to the Unyson section of your WordPress dashboard

16. Access the WOffice Maintenance extension settings

17. Access the style tab and specify the colors and opacity value as illustrated below:

The main changes include:

Text color :: #fd7b38

Background color :: #ffffff

Layer Opacity :: 0.8

18. Save your changes