Colors

You are here:
In this article

Colors

All of the color settings are in the theme.

General

Skin

  • Theme SkinChoose one of the predefined styles or set your own colors
  • One ColorIf select “One Color Skin” in “Theme Skin,” you can set your base color of the website

Background

  • Body BackgroundUsed for “Boxed Layout,” the color of the body
  • Content BackgroundThe background color of the content

Header

  • Header backgroundColor of the header background

Top Bar

  • Top Bar Left | background color of the Top Bar Left
  • Top Bar Middle | background color of the Top Bar Middle
  • Top Bar Right | background color of the Top Bar Right
  • Top Bar Right | colors of the Icon used in the Top Bar Right
  • BackgroundThe background color of the search input field in a header

Subheader

  • BackgroundThe background color of a subheader
  • Title color is the color of the text inside the subheader

Menu

Menu

  • Link Color of links inside the menu
  • Active Link color of the active links inside the menu
  • The active Link background color of the active links inside the menu

Submenu

  • BackgroundThe background color of links inside the submenu
  • Color of links inside the submenu
  • The color of the hover active links inside the menu while hovering it

Menu Icon

  • Icon color; The color of the menu icon (hamburger).
  • Icon background; The background color of the menu icon.

Styles

  • Overlay Menu background color of the overlay menu
  • Overlay Menu Link colorColor of the links in the overlay menu
  • Overlay Menu Active Link collective link color of the overlay menu
  • Plain Border color of the overlay menu

Side Slide

  • BackgroundBackground color of the side slide menu
  • Link coloring color of the side slide menu
  • Active Link collective link color of the side slide menu

Action Bar

Desktop & Tablet

  • BackgroundBackground color of the Action Bar
  • Text colorColor of the text inside the Action Bar
  • Link coloring color of the text inside the Action Bar
  • Link | Hover the color of the text inside the Action Bar
  • Social Icon | ColorColor of the icons inside the Action Bar
  • Social Icon | Hover color of the social icons of the Action Bar

Mobile

  • BackgroundBackground color of the Action Bar
  • Text colorColor of the text inside the Action Bar
  • Link coloring color of the text inside the Action Bar
  • Link | Hover color of the text inside the Action Bar
  • Social Icon | ColorColor of the icons inside the Action Bar
  • Social Icon | Hover color hover color of the social icons of the Action Bar

Content

  • Theme | color-highlighted button background, some icons, and other small elements inside the content
  • Text | color default color of the content
  • Selection | color the color of the background while selecting some text

Link

  • Link | coloring color of the text inside the Content
  • Link | hover color of the links inside the Content
  • Fancy Link | Color color of the Fancy Link
  • Fancy Link | background color of the Fancy Link
  • Fancy Link | hover the color of the fancy links
  • Fancy Link | hover the background color of the fancy links

Image Frame

  • Image Frame | Border color of the frame of an image
  • Image Frame | Link background

    The background color of the link of an image frame
    This is also Image Frame Hover Link color

  • Image Frame | Link color

    The color of the link of an image frame
    This is also Image Frame Hover Link background

  • Image Frame | Mask color the background color of the mask of an image frame
    Mask has predefined opacity of 0.4

Inline Shortcodes

  • Dropcap & Highlight background color of drop cap and highlight shortcodes
  • Hr colorColor of the HR tag also includes the color of Dots, ZigZag
  • List color text color of the HTML list, ordered, unordered & bullets list
  • Note color the color of the notes, including Blog meta, Filters, Widgets meta

Section

  • Highlight Section background color of the highlight section feature
  • Theme colorColor for icons and other small elements inside the footer
  • Background The background color is a footer
  • Text color text color of the footer
  • Heading color heading color of the footer
  • Note color color of the notes, including Widgets meta
  • Copyright border color of the copyright border inside the footer
  • Link | coloring color of the text inside the Footer
  • Link | Hover color of the text inside the Footer
  • Social Icon | ColorColor of the icons inside the Footer
  • Social Icon | Hover color of the social icons in the Footer
  • Icon | colors color of the text of back-to-top icon
  • Icon | background color of the back-to-top icon

Sliding Top

Back to Top & Popup Contact Form

  • Sliding Top Theme colorColor for icons and other small elements
  • Sliding Top background color of the sliding top
  • Sliding Top Text color of the text
  • Sliding Top Link color the color of the links
  • Sliding Top Hover Link color hover color of the links
  • Sliding Top Heading color the color of the headings
  • Sliding Top Note color the color of the notes, including Widgets meta

Headings

  • Heading H1 colors color of the H1 heading
  • Heading H2 colors color of the H2 heading
  • Heading H3 colors color of the H3 heading
  • Heading H4 colors color of the H4 heading
  • Heading H5 colors color of the H5 heading
  • Heading H6 colors color of the H6 heading

Shortcodes

  • Accordion & Tabs Active Title color the color of the active accordion and tabs title
  • Blockquote colors color of the blockquote element
  • Contact Box | background color of the contact box is also Infobox background
  • Content Link | icon colors color of an icon in a Content Link shortcode; this is also the Content Link hover border
  • Counter Icon | color The color of an icon on the counter is also the Chart Progress color
  • Icon Bar Hover Icon color The hover color of icons of the Icon Bar
  • Icon Bar Icon color The color of the icons of the Icon Bar
  • List & Feature List Icon color The color of icons inside the List and Feature list
  • Pricing Box | Price color The color of the price of the Pricing box
  • Pricing Box | Featured background The background color of the price of the featured pricing box
  • Progress Bar background The background color of the progress bar
  • Quick Fact Number Color The color of a number inside the quick fact
  • Sliding Box Title background The background color of a title inside a sliding box
  • Sliding Box Subtitle background The background color of a subtitle inside a sliding box

Forms

Input, Select & Textarea

  • Text color The color of a content
  • BackgroundThe background color of these elements
  • Border color The border color of form elements
  • Placeholder color The color of a placeholder

Focus

  • Text Color The color of content while the element is focused
  • BackgroundThe background color of these elements while the element is focused
  • Border color border color of form elements while the element is focused
  • Placeholder color The color of a placeholder while the element is focused

Advanced

  • Border width The border width of the form elements
  • Background Transparency (alpha)The background color transparency of a form
 
 

 

Was this article helpful?
Dislike 0
Views: 8