Navigate to customizer
Customizing >> Colors
Reign has a couple of inbuilt five-color schemes.
You can toggle to anyone to get a preview inside the customizer. It will help to start with any color combination and use color options below them to set up the color elements of each object.
Color Option: We have the following Color options for each section.
Topbar
- TopBar Background Color Allows you to choose a background color for the top bar.
- TopBar Text Color Allows you to choose a text color for content written inside the top bar.
- TopBar Text Allows you to choose a hover color for links used inside the top bar.
Header
- Header Background Color Allows you can choose a background color for your header.
- Site Title Font Color Allows you to choose a site title color for your site.
- Header Icon Color Allows you to choose icon color.
- Header Icon Hover Color Allows you to choose an icon hover color.
Menus
- Main Menu Item font color Allows you to choose a menu text color. (This setting will work for the Main Menu Hover Style one, two, and, three)
- Main Menu Item font Color [Hover] Allows you to choose a text hover color. (This setting will work for the Main Menu Hover Style layouts one, two, and three)
- Main Menu Text Color[Active] Allows you to choose an active text color. (This setting will work for the main Menu Hover Style one, two, and three)
- Main Menu Background Color[Hover] Allows you to choose a background hover color. (This setting will work as a border color for the Main Menu Hover Style one, two, and three and as a background color for the hover styles four, five, and six)
- Main Menu Background Color [Active] Allows you to choose an active background color. (This setting will work as a border color for the Main Menu Hover Style one, two, and three and as a background color for the hover styles four, five, and six)
- Sub Menu Background Color Allows you to choose a background color for the sub-menu.
- Sub Menu Text Color Allows you to choose a menu text color.
- Sub Menu Text Hover Color Allows you to choose a text hover color.
- Sub Menu Background Hover Color Allows you to choose a background hover color.
Top Bar & Header color scheme options
Body
- BodyBody Background Color Allows you to choose a body text color for the site.
- Body Text Color Allows you to choose a body text color for the site.
- Sections Background Color Allows you to choose a section background color for the site.
- Theme Color Allows you to choose a primary color or active color for the site.
Content
- Headings color Allows you to choose the color of a heading for the site.
- Link Color Allows you to choose a link color for the site.
- Link Hover Color Allows you to choose a link hover color for the site.
- Content Link Color Allows you to choose the link color of the content area for your site.
- Content Link Hover Color Allows you to choose links to the hover color of the content area for your site.
- Button Text Color Allows you to choose a button text color for the site.
- Button Text Hover Color Allows you to choose a button text hover color for the site.
- Button Background Color Allows you to choose a button background color for your site.
- Button Background Hover Color Allows you to choose a button background hover color for your site.
- Border Color Allows you to choose the site border color.
- HR Color Allows you to choose an hr color for the site.
Heading, Link Content, Button color scheme options
Left Panel
- Left Panel Background Color allows managing the background color of the left panel.
- Left Panel toggle Color allows managing the color of the left panel toggle.
- Left Panel Font Color allows managing the color of the left panel menu item.
- Left Panel Font Color[Hover] allows managing the color of the left panel menu item hover.
- Left Panel Font Color[Active] allows managing the color of the left panel menu item active.
- Left Panel Background Color[Hover] allows managing the background color of the left panel menu item hover.
- Left Panel Background Color[Active] allows managing the background color of the left panel menu item active.
Footer
- Footer Background Color Allows you can choose the footer background color.
- Footer Widget Title Color Allows you can choose the footer widget title color.
- Footer Text Color Allows you can choose footer text color.
- Footer Link Hover Color Allows you can choose footer links to hover color.
- Copyright Background Color Allows you can choose the copyright background color.
- Copyright Text Color Allows you can choose copyright text color.
- Copyright Link Color Allows you can choose copyright link color.
- Copyright Link Hover Color Allows you can choose copyright links to hover color.
Footer Link, Content, Background, Widget Title Copyright section color scheme options
Forms
- Form Text Color Allows you to choose the form’s text color.
- Form Background ColorAllows you to choose the form’s background color.
- Form Border Color Allows you to choose the form’s border color.
- Form Placeholder ColorAllows you to choose the form’s placeholder color.
- Form Focus Text Color Allows you to choose the form’s focus text color.
- Form Focus Background Color Allows you to choose the form’s focus background color.
- Form Focus Border Color Allows you to choose the form’s focus border color.
- Form Focus Placeholder Color Allows you to choose the form’s focus placeholder color.
Form Feild Colors
Form Feilds Focus Color