---
title: "Add Custom CSS - Convert Forms"
description: "The Form Builder offers a way to inject your own Custom CSS with the option to also add your own Class Suffix.   	   	 		Navigate to Compone"
url: "https://www.tassos.gr/docs/convert-forms/customize/custom-css"
date: "2026-05-15T05:34:22+00:00"
language: "en-GB"
---

[ Home ](https://www.tassos.gr/index.php?option=com_content&view=category&layout=blog&id=24&Itemid=1088) / [ Convert Forms ](https://www.tassos.gr/index.php?option=com_content&view=category&id=43) / [ Styling and Customization ](https://www.tassos.gr/index.php?option=com_content&view=category&id=71)

#  Add Custom CSS

 The Form Builder offers a way to inject your own Custom CSS with the option to also add your own Class Suffix.

 ![convert forms custom css](https://www.tassos.gr/images/convert-forms-custom-css.png)

- Navigate to *Components &gt; Convert Forms &gt; Forms*
- Click *New* on the horizontal bar.
- Choose a form template or create a new one from scratch.
- Once you are in the Form Builder, click the **Advanced** accordion tab.
- You can fill in your Custom CSS as it is shown in the screenshot above.

 Using a Class Suffix is optional but recommended if you would like to combine your Custom CSS with your Class Suffix without having to edit your template's stylesheet.

 ![convert forms custom css class](https://www.tassos.gr/images/convert-forms-custom-css-class.png)

 Last updated on Nov 26th 2024 12:11

## Schema

```json
{
    "@context": "https://schema.org",
    "@type": "BreadcrumbList",
    "itemListElement": [
        {
            "@type": "ListItem",
            "position": 1,
            "name": "Home",
            "item": "https://www.tassos.gr"
        },
        {
            "@type": "ListItem",
            "position": 2,
            "name": "Home",
            "item": "https://www.tassos.gr/docs"
        },
        {
            "@type": "ListItem",
            "position": 3,
            "name": "Convert Forms",
            "item": "https://www.tassos.gr/docs/convert-forms"
        },
        {
            "@type": "ListItem",
            "position": 4,
            "name": "Styling and Customization",
            "item": "https://www.tassos.gr/docs/convert-forms/customize"
        },
        {
            "@type": "ListItem",
            "position": 5,
            "name": "Add Custom CSS",
            "item": "https://www.tassos.gr/docs/convert-forms/customize/custom-css"
        }
    ]
}
```

```json
{
    "@context": "https://schema.org",
    "@type": "Article",
    "mainEntityOfPage": {
        "@type": "WebPage",
        "@id": "https://www.tassos.gr/docs/convert-forms/customize/custom-css"
    },
    "headline": "Add Custom CSS",
    "image": {
        "@type": "ImageObject",
        "url": "https://www.tassos.gr/"
    },
    "publisher": {
        "@type": "Organization",
        "name": "Tassos",
        "logo": {
            "@type": "ImageObject",
            "url": "https://www.tassos.gr/https://www.tassos.gr/media/brand/logo-text.png"
        }
    },
    "author": {
        "@type": "Person",
        "name": "Sotiris Katsaniotis",
        "url": "https://www.tassos.gr/docs/convert-forms/customize/custom-css"
    },
    "datePublished": "2016-12-29T00:59:36+02:00",
    "dateCreated": "2016-12-29T00:59:36+02:00",
    "dateModified": "2024-11-26T12:28:42+02:00"
}
```
