SwiftUI Image Tint
Reading time: 1 min
This recipe shows how to tint SwiftUI images in two ways - by setting the template tint or color multiply.
The end result looks like this:
Let's start by saying that foregroundColor has no effect here. With that out of the way, the recipe depends on what you want to do with the image, since I've seen tint being used in more than once context:
For photos and logos with multi-color images, use colorMultiply
Half of the time, "tinting an image" means the following:
This is achieved by using the
colorMultiply modifier on the
For monochrome images, use renderingMode
If you have a monochrome image or one where all that matters is the outline, use
template, then apply
foregroundColor. This will basically set the color to all non-transparent pixels in the image:
Image("swift") .renderingMode(.template) .foregroundColor(.blue)
With the following effect:
colorMultiply with monochrome images usually leads to undesired results, like the entire image being black.