Mobile app version of vmapp.org
Login or Join
Frith110

: Drawing text on an image background that has dark and bright parts Often, I want to write text over a background image. If the background image is bright, I use a dark color for the text,

@Frith110

Posted in: #Background #Color #Text

Often, I want to write text over a background image. If the background image is bright, I use a dark color for the text, and vice versa. But, often the image has both dark and bright parts. So a dark text is unreadable on the dark parts, and a bright text is unreadable on the bright parts.

I currently use one of several solutions, all of them are imperfect:


Brighten the image and use a dark font, or darken the image and use a white font; the problem is that it reduces the beauty of the background image.
Use grey text (as in this question: Is there a single text color that is acceptable on both dark and light background? ). But grey text often looks unappealing, and is still only barely readable.
Use dark text, and try to position it on the bright spots of the image (or vice versa). This takes a lot of time because it requires me to position each word separately.


Are there better solutions to this problem?

In particular: is there an automatic tool that takes an image and a text, and positions the text only on the dark/bright parts of the image?

10.02% popularity Vote Up Vote Down


Login to follow query

More posts by @Frith110

2 Comments

Sorted by latest first Latest Oldest Best

 

@Murray976

Adding to GraphicsRPS's answer (definitely the best approach!), you can also try with some transparency.

For example:



Image Source

10% popularity Vote Up Vote Down


 

@Holmes874

There is no tool to decide where text specifically goes according to the darkness or brightness of a photo. I would suggest either adding a subtle drop shadow to help separate the text slightly (only use this for headers/subheads). If that does not work, then try putting a stroke around your type to help differentiate it. Dark type on a light background, use a light stroke color and vice versa. Other than that, do what you have been trying by adjusting the image slightly. Being a designer takes years of experimenting, so try it out. Hope this helps.

10% popularity Vote Up Vote Down


Back to top | Use Dark Theme