# How do I remove or style the asterisk (*) for required fields on HubSpot forms?

Technical Difficulty: Intermediate

Written by [Stephanie O'Gay Garcia](/content/hubspot-website-development/author/stephanie-ogay-garcia/index.html)

First Published:

September 22, 2019

Last Updated:

October 22, 2023

⚠️ Note that this post hasn't been updated for at least a year and the information may be outdated, proceed with caution! _(Last updated: October 22, 2023)_

When you enable the "Make this field required" setting on a HubSpot form field, it will show an asterisk (*) next to the field label:

You can remove or style this on your portal using CSS.

## Remove the required field asterisk

You can remove the required field asterisk using the following CSS snippet:

```
.hs-form-required { display: none; }
```

[Scroll down](/content/hubspot-website-development/how-do-i-remove-or-style-the-asterisk-for-required-fields-on-hubspot-forms#where-to-add-the-code-snippets-above/index.html) to learn where to add this code.

## Style the required field asterisk

Alternatively, instead of removing the asterisk completely, you can also style the asterisk using CSS.

### Changing the colour

You can update the colour of the asterisk above with the following CSS snippet:

```
.hs-form-required { color: #0171b2; }
```
where you can replace the above colour (`#0171b2`) with your own.

## Where to add your code

There are a few places you can add this code depending on your comfort level and which forms you'd like to hide the asterisk on.

### Add the code to your theme's stylesheet

The best practice would be to update your website theme's stylesheet. You can find your theme by going to Marketing > Files & Templates > Design Tools and locating your theme in the sidebar.

In most HubSpot themes that follow [the CMS boilerplate](https://developers.hubspot.com/docs/cms/building-blocks/themes/hubspot-cms-boilerplate) structure, you can go into css > elements and open the `_forms.css` file which will already have a "Validation" section with the `.hs-form-required` CSS class:

However, themes vary a lot. Also, if you're using a Marketplace theme, you'll need to create a child theme to make any changes, so I wouldn't recommend updating this unless you're comfortable with CSS.

Note that updating the styling from your theme's stylesheet will affect all forms on your website.

### Add the code to your template or page

You can style the form on a specific template or page in the "Additional <head> markup" section of your template or the "Head HTML" settings of your page (read HubSpot's help article [here](https://knowledge.hubspot.com/articles/kcs_article/cos-general/how-can-i-add-code-snippets-to-the-head-and-footer-html-of-my-pages#add-code-to-the-head-or-footer-html-of-a-specific-page)).

If you are doing this, you'll want to add the opening `<style>` tag before your CSS and the ending `</style>` tag after your CSS, like this:

```
<style>
.hs-form-required { display: none; }
</style>
```

If you found this helpful, buy me a coffee! ❤️

[Buy me a coffee](https://buymeacoffee.com/stephanieogaygarcia)
