Hubspot Form Elements in Webflow

This page represents HTML structure of some of the HubSpot form elements, use the power of Webflow designer to define CSS styles for a raw HubSpot form embed.

Some Form Elements

hs-form

form-columns-1

form-columns-2

hs-form is main form class.

form-columns-1 is class of wrapper with 1 column for inputs.

form-columns-2 is class of wrapper with 2 columns for inputs.

input and label

hs-input

Form label

Field Description / Help text

hs-field-desc

Form label

This is help text for the field

Field error message

hs-error-msgs inputs-list

hs-error-msg

Form label

Error message label

hs-error-msgs inputs-list is an HTML list element.

hs-error-msg is a text span inside HTML List Item element.

Text area Input

hs-input hs-fieldtype-textarea

Form label

hs-fieldtype-textarea is added as combo class.

Checkboxes

hs-form-booleancheckbox

hs-form-booleancheckbox-display

inputs-list

hs-input

Nature
Politics
Technology

Note: HubSpot uses basic HTML checkboxes, Webflow checkboxes work differently than the default HTML checkboxes, hence in order to style HubSpot checkboxes you need custom CSS.

Checkbox 3

you can use Webflow checkbox to style and then copy CSS from it.

Radio Buttons

inputs-list

hs-form-radio

hs-form-radio-display

inputs-list

hs-input

Success message

submitted-message

This is form success message

RecaptCHA

hs-recaptcha

Submit button

hs_submit

hs-button

Thank you! Your submission has been received!

Oops! Something went wrong while submitting the form.

Live Example

Webflow Form

Thank you! Your submission has been received!

Oops! Something went wrong while submitting the form.

HubSpot form

Please insert your own HubSpot code inside the embed :)

Success!

Thank you! We have received your submission.

How can we help you?

The Hex Trust team is here to answer any questions you might have. Please enter your details below and we will contact you as soon as possible.

Thank you for getting in touch with us!

A member of our team will be in touch as soon as possible.

Oops! Something went wrong while submitting the form.

How can we help you?

The Hex Trust team is here to answer any questions you might have. Please enter your details below and we will contact you as soon as possible.

Thank you for getting in touch with us!

A member of our team will be in touch as soon as possible.

Oops! Something went wrong while submitting the form.

Hubspot Form Elements in Webflow

Live Example

Webflow Form

HubSpot form

Success!

How can we help you?

How can we help you?

Get Access to Hex Trust Platform:

Hex Trust wrapped XRP