How to change hero text color on Dawn

sunshinepup
New Member
1 0 0

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?

Reply 1 (1)
Niki_K
Shopify Partner
218 24 65

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;
}
Send me a link to your store to niki@hey.com and I'll help you out.
For more info what I do, visit nikikozak.me