Sketch: “Overriding” the color of text layers in symbols.
Francesco Bertocci

Francesco Bertocci You can actually use it on a non-white background and dark backgrounds, with multiply/screen properties attached. Here’s a sketch file version that works across any kind of background (though you’ll need 2 separate symbols to determine which bg it should go on top of), but you’ll still have all the text color options available.

I added a third option, which is Exclusion. This one is cool because it will auto-color the text based on the background color. So if the text is on top of black (or dark gray) it will become white. If the text is on top of white (or light gray), it will become dark.

Now if the text is on top of a color such as red, the text will become this ugly neon blue. But if you set the blending mode of the local symbol to Luminosity, the text will become white (which is what you usually want against a colored bg)

*Important* — Note that the text needs something to blend against, so the artboard should have a background color (white) to be safe.

Show your support

Clapping shows how much you appreciated Alan Roy’s story.