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.
- In your HubSpot Marketing account, navigate to Contacts > Forms.
- Click the name of the form.
- Click the Embed tab and select Remove HubSpot default styling.
- Click Copy embed code and add it to 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 (with the HubSpot default styling removed) embedded on your external site, 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.