To style your embedded HubSpot form, you will need to first remove the default HubSpot styling by editing the form in HubSpot. You can then target and apply styling to the embedded form by editing your CSS file for your external page or the embed code itself.
- Navigate in HubSpot Marketing to Contacts > Forms and click on the name of the form.
- Go to the Embed tab and check the box next to Remove HubSpot default styling.
- Then click Copy embed code and place on your external site. If you have already embedded your form on your external page, you will need to replace the existing code with this new version. Read more about embedding HubSpot forms here.
- Once you have the HubSpot form embedded on your external site, with the HubSpot default styling removed, you can style the form in your external site's CSS file. For a list of selectors used in HubSpot forms, check out this article.