Do you add a spot of color for text emphasis?

Updated by Brady Stroud [SSW] 1 year ago. See history

123
<introEmbed body={<> When there are key words that you want people to notice, you can add a spot of color on the important word for emphasis. </>} />

You should make parts of the text different colors just like you’d highlight or boldface parts of a sentence. The duo colored text will help emphasize your message.

Use colors from your branding/design system when you do this.

Image

Figure: The TV signage has the important words in red

Use color sparingly

While a spot of color can guide attention and improve scannability, overusing color has the opposite effect. If everything is emphasized, nothing stands out.

Too many bright or contrasting elements:

  • Create visual noise, making the UI feel cluttered and overwhelming
  • Reduce readability and accessibility, especially for users with visual impairments
  • Make it harder for users to know what truly matters

Stick to one accent colors per screen or section. Use them intentionally—only for elements that truly require user focus.

::: img-medium good

Image

Figure: See bottom tagline - Don't make the important word “quality software” in red... because you already have red

:::

::: img-medium good

Image

Figure: See bottom tagline - Make the important word “quality software” in red... because you do not have red

:::

Avoid using color for full sentences, even if it's just one word

Color should be used to emphasize keywords or short phrases within a sentence — not to style entire statements.

Tip: Instead of coloring a sentence, add a colored icon (like ✅ or ❌). This keeps the message clear and accessible while still providing visual emphasis.

Use color to guide, not to shout.

::: img-medium bad

Image

Figure: Bad example - Text in green is too much

:::

::: img-medium good

Image

Figure: Good example - Text in content color (white in this dark mode example) with a green tick

:::

Acknowledgements

Ken Shi
Adam Cogan
Tiago Araujo
Related rules

Need help?

SSW Consulting has over 30 years of experience developing awesome software solutions.

We open source.Loving SSW Rules? Star us on GitHub. Star