How to Add Custom HTML and CSS in LeadCapture.io

LeadCapture.io supports limited customization using Custom HTML and CSS, specifically through the Custom Teaser Code section found inside each form step.

This allows you to style and add elements such as custom messages, formatting, and even simple visuals like icons or styled text.

Where to Add Custom HTML and CSS

Open your form and go to the Steps tab
Select the step where you want the styling to appear
Scroll down to Advanced Options
Toggle ON Custom Teaser Code

You’ll now see two fields:

Custom Teaser HTML – where you write your message or content
Custom Teaser CSS – where you style that content

Example Use Case

Let’s say you want to show this styled message:

You're almost there! Get ready to receive your exclusive car quote offer.

Custom Teaser HTML:

Paste this in the Custom Teaser HTML field:

<br> <p class="step-teaser-text">You&#39;re almost there! Get ready to receive your exclusive car quote offer.</p>

Custom Teaser CSS:

Paste this in the Custom Teaser CSS field:

.step-teaser-text {
  font-weight: bold;
  font-size: 16px;
  color: green;
}

This will display the message in bold green text at 16px below the responses on that step.

What You Can Do with Custom HTML & CSS

Style Step Teaser Text

– Adjust font size, color, alignment, and weight

Insert basic visuals (HTML only)

– Add images or icons using tags inside the HTML field

Enhance response styling (limited)

– For example, style surrounding text or visual cues below responses

Limitations to Keep in Mind

Custom CSS is step-specific, there is no global CSS across the form
You can’t directly style form fields (yet)
We’re working on expanded customization features to make this more flexible in the future