How can I match CometChat with my site colors?

This guide will assist you to match the CometChat default theme with your site colors. This basic tutorial can help you theme CometChat even if you have no knowledge about CSS.

You can always use our in-built theme editor to change colors directly via CometChat Administration Panel.

You can edit your theme with the help of two simple tools.

1. Color Changer

You can change the base color with the help of a slider.

Color changer

2. Theme Variables

With Theme Variables you can edit or set colors, font family and font sizes of your theme.

Theme variables

For example, to set the background color of your bar, click on the color box that is next to bar_background and then select the desired color accordingly.

Similarly you can change the other theme variables as well.

bar background

After the modification, CometChat will look like:

Not finding what you need?

The CometChat team is here to help!