3️⃣Customize the Theme
Customize the widget to best match your web’s design.
We offer a range of customization options to help you create a widget that matches your preferred style. Please refer to the guide below and our Widget API reference for detailed instructions.
mode
When customizing your website-style widget, start by selecting a mode that suits your preference and proceed with the following customization. We offer two modes: dark
and light
.
font-family
This option sets the font display for the widget, and works in compatibility with css font-family property.
Please note that you need to install the font that you want to use in your frontend project by yourself.
border-radius
You have the option to customize the border-radius of three different components based on your preference.
Please refer to the image below to see the areas that are affected by each border-radius class:
colors
First and foremost, customize the colors that will be used in our widget to create a unified appearance. You have the option to select a primary color and a gradient color to personalize the components.
Secondary, the primary color represents the main color style of the entire widget. As shown in the example below, the primary color will be applied throughout the widget whenever it is used by users.
Additionally, assign the chosen colors to the respective components. Currently, the button is the only component that supports gradient colors.
If you prefer to have a single color for your button component, you can refer to the example code provided below to see the desired result.
Last but not least, we also offer two additional styles for the button: 'grey' and 'neutral'. You can choose the style that best fits your preferences and design aesthetics.
For additional information, please refer to our Widget API Reference.
Last updated