How to change color of single word in a text string

I wish to change the text color of only a single word in a line of text.

I haven’t yet figured out how to do this in Pinegrow. (Pinegrow Pro 5.96 on Mac.)
Even with “Focus” and “Inline Styling” turned on in various combinations, any changes only affect the entire text block, not an individual word.

Online search brings me to this page:

Which tells me to use a Span element in the html, and then add color classes to the CSS.

Is there a way to do this in Pinegrow?
Or do I just manually add the spans and classes to the html/CSS?


yes, that’s right… you are going to need a span element to contain the word with a different color.

PG will insert a span for you from the text editing mode (double click inside a text block to select the mode, and a blue menu will appear, highlight the word and click span

to exit text mode, click done.


from there you can either create an inline style on the span to choose the color (quick and dirty, not recommended) or add a class to the span that you can use to assign a color in your .css file

Thanks @droidgoo, that’s the ticket!

Your explanation is most helpful. As soon as I read your post, I remember coming across that dialog box previously, and now realize that it features “span” in it. This will do exactly what I need. Thanks!

1 Like