# Custom Classes
The **Custom Classes** setting in the **CCFBW** plugin allows users to customize the appearance of elements by adding **CSS classes.** This feature provides flexibility for users to style elements according to their website’s design.
What Are CSS Classes?
**CSS (Cascading Style Sheets)** classes are used to apply specific styles to HTML elements. By assigning a CSS class to an element, you can control its appearance, such as its color, size, or position, using the class name in your CSS stylesheet.
[Each element](https://docs.stylemixthemes.com/checkout-custom-fields-builder-for-woocommerce/checkout-builder-elements) within the Checkout Builder of **CCFBW** has a field labeled **Custom Class Name in its settings**. Users can input the names of their custom CSS classes into this field to apply specific styles to those elements:
Custom Classes setting
{% hint style="info" %}
But these classes should be defined in your WordPress **beforehand**.
{% endhint %}
### How to define Custom (Additional) Classes on WordPress?
1. Follow **WordPress Dashboard > Appearance > Themes** and click on the **Customize** button in your active theme:
2. Open **Additional CSS** tab:
{% hint style="info" %}
The location of the **Additional CSS** tab may vary based on your theme.
{% endhint %}
3. Define your CSS classes to the designated area and **Publish** the theme:
Here is an example of the CSS classes that hide buttons and change the color of the title of the number field
```css
.custom-style-for-number .woo-item__title span {
color: red;
}
.custom-style-for-number .input-number-counter {
display: none !important;
}
```
## How to Add Custom CSS to Elements?
1. Open the element settings and write down the CSS class names without dots (`.`) at the beginning and separate them with spaces. Here is the example input:
```
custom-style-for-number input-number-counter sample-class
```
2. Here is the result of our changes:
{% tabs %}
{% tab title="BEFORE" %}
{% endtab %}
{% tab title="AFTER" %}
{% endtab %}
{% endtabs %}
You can check the CSS classes via **Developer Tools** on your browser:
