Debut Theme // Improve legibility of image + text overlays

Highlighted
Excursionist
15 0 4

Hi

 

Hoping someone can help me with this issue - I have a hero image on my homepage using an image + text however in order for the text to be easy to read Shopify applies a mask over the image which works but it means the image gets quite dull and greyed out.

I have tried playing with the overlay colour and transparency but as soon as you lower it enough to ensure the image is vibrant, the text becomes very hard to read.

 

I thought about making the image in Photoshop with just a black box around my text but when I did a test run I can see that it messes up when the window is made smaller or on mobile because it's no longer responsive.... What can I do?

URL:  thetrouvailles.com 

 

Thanks

Josh

0 Likes
Highlighted
Shopify Partner
485 73 108

Your store is inspect protected. please enable it so that i can give you solution

If this solution works, then please accept it as solution and like.
For theme customization, please contact parambabla.soft@gmail.com
0 Likes
Highlighted
Excursionist
15 0 4

Should be able to now - Let me know

0 Likes
Highlighted
Shopify Staff
Shopify Staff
514 54 102

Hi @jmr93,

Hyde here from Shopify. Great question!

You could always try adjusting the actual font color to create more contrast! There's a helpful guide on how to edit your typography, color, and layout right here.

Here's the video from the guide too:

If that doesn't help or if I've misunderstood the question, please do let me know I'm happy to help!

All the best, Hyde.

Hyde | Social Care @ Shopify 
 - Was my reply helpful? Click Like to let me know! 
 - Was your question answered? Mark it as an Accepted Solution
 - To learn more visit the Shopify Help Center or the Shopify Blog

0 Likes