Color Styling
To customize the color of your website, please navigate to Appearance > Customize > Color. There you can customize color elements of your website within three sections: general, button, and shop.
General
In the General section, you can customize the color style of website main elements such as heading
- Main accent color: the color for the link elements such as categories and social icons
- Body text color: the color for body text
- Heading text color: the color for heading
- Extra color: the color for breadcrumbs, post meta, author name and comment info
- Widget title color: the color for widget title which can be seen on the sidebar or footer area
- Border color: the color for border line such as separator line in the widget
Button
In the Button section you can customize the button color of each style on your site.
- Button solid: the color for button solid style, such as the Submit button on comment section or Checkout button
- Button outline: the color for button outline style, such as View Cart button. You can change the color based on the header transparent. If you want to custom the general button outline (no transparent header), custom the button outline dark section.
NOTE: You can also set up the button radius within this section.
Shop
In the Shop section you can customize the color style of shop elements such as notification text or product badge.
- Success color: the color for success notification (ex: when you successfully add a product to cart)
- Info color: the color element for info notification (ex: the notification in the download section of My Account page)
- Alert color: the color element for alert notification (ex: when you wrongly input coupon code in the cart/checkout page)
- New color: the color element for ‘new’ product badge
- Sale color: the color element for ‘sale’ product badge
- Star color: the color element for star ratings