Customize Your Form Using Custom CSS Codes

January 12, 2022

UPDATE: Let’s create fantastic forms with Form Designer video course which allows you to generate beautiful form designs without knowledge of CSS!

First, you need to learn how to inject custom CSS on your form before you can start customizing your form using the CSS codes provided below.

Set a Background Image to the Page

.supernova {
background-image: url('');
background-repeat: no-repeat;
background-position: center top;
background-attachment: fixed;
background-size: cover;
body {
background: none;

Replace the URL with your background image.


Make Page Background Transparent

.supernova, body {
background: none;

Make Form Background Transparent

.form-all {
background: none;

Remove the Spacing Above the Form

body, .form-all {
margin-top: 0;

Change the Header Background Color

[data-type="control_head"] {
background-color: #FFCC66;

Change the Subheader Text Color

.form-subHeader {
color: #2408FC !important;

Change all the Sub Label Color

.form-sub-label {
color: #FFCC66;

Change the Yellow Highlight Effect Color

.form-line-active {
background: #baffb9;

Change the Form Required Star Color

.form-required {
color: blue !important;

Remove the Red Background on Error Messages

.form-line-error {
background: transparent;

Align Form to the Left

.form-all {
margin: 0;

Preview Here

Instantly Create Two Column Layout on Shrunken Fields

.form-line-column {
width: 50%;
.form-line-column:nth-child(even) {
clear: left;

Demo here

Make Credit Card Fields in All Payment Integration Mobile Responsive

Copy the CSS codes here:

Demo here

If you can’t find the CSS code you need for your form or if you need help with customizing your form, feel free to leave comments below.

Was this guide helpful?
Contact Support:

Our customer support team is available 24/7 and our average response time is between one to two hours.
Our team can be contacted via:

Support Forum:

Contact Jotform Support:

Send Comment:

Jotform Avatar
This site is protected by reCAPTCHA and the Google Privacy Policy and Terms of Service apply.