Changing the color of Newsletter Box in footer - Studio theme

Hi. I am wanting to change the color of the Newsletter box to white and the text inside to be black. Any suggestions on how to do this? The picture below is what I currently have. Thank you!

Is there a way that I can change just the newsletter box instead of the entire footer section?

1 Like

Hi @aosttg , You can add it with a bit of custom code.

Go to Online Store > Themes > Actions > Edit code > Assets > base.css

Scroll all the way to the bottom and add the following code.

.newsletter-form__field-wrapper input {
  background-color: white;
}
.newsletter-form__field-wrapper label {
  color: black;
}

If you have found this answer helpful please like and mark the question as solved. Thanks.

Hi, thank you!

The code did not work in base.css but it did in component-newsletter.css. The only issue I am having is that the text is white when I try to type in the box. How do I get it to be black? The website is An Open Sketchbook (thetinygreenhouse.com) if you wanted to check it out.

  • Just add another line color:#000; under the input section.
  • It worked for me in the base. if it works in component for you, then okay. Whatever works. :grin:

If you have found this answer helpful please like my replies above and mark the question as solved. Thanks.

Hi @aosttg , you can add this CSS to change the input field color.

.newsletter-form__field-wrapper .field__input {
    color: black;
}

If you have any other theme edit task, feel free to checkout our app. The first task in it is Free.