How to change hero text color on Dawn

[sunshinepup]

How can I change the hero text color on Dawn? Right now it's a light background with white text - and is not legible. Is there a way to change the font to black? And to add a transparent box so it pops while still being able to see the image behind it?

[Niki_K]

Hi @sunshinepup,

to change the color of the heading (you need to find the relevant class), you can create a custom class in the base.css file and then add this class to the corresponding element in the code.

If using Dawn theme, it should work as follows: 

In image-banner.liquid file: 

<h2 class="banner__heading YOURCLASS {% if block.settings.heading_size == 'medium' %}h1{% else %}h0{% endif %}" {{ block.shopify_attributes }}>
        <span>{{ block.settings.heading | escape }}</span>
</h2>

 In base.css file:

.YOURCLASS {
  color: xxxxx;
}