How to change the color of a UIImage in Swift

Question

I'm in swift and I'm trying to generate a function that takes in a UIImage and a UIColor and returns a UIImage recolored

I'm not working with a UIImageView, these are simply UIImages that I intend to use as icons. Is there any good way to implement this?

Solution 1

edit/update:

For iOS10+ we can use UIGraphicsImageRenderer:

Xcode 11 • Swift 5.1

extension UIImage {
    func tinted(with color: UIColor, isOpaque: Bool = false) -> UIImage? {
        let format = imageRendererFormat
        format.opaque = isOpaque
        return UIGraphicsImageRenderer(size: size, format: format).image { _ in
            color.set()
            withRenderingMode(.alwaysTemplate).draw(at: .zero) 
        }
    }
}

---

Playground Testing

let camera = UIImage(data: try! Data(contentsOf: URL(string: "https://cdn4.iconfinder.com/data/icons/ionicons/512/icon-camera-128.png")!))!
let redCamera = camera.tinted(with: .red)

---

original answer

You can use UIGraphicsBeginImageContextWithOptions to begin an image context, set the desired color and use image's method func draw(in rect: CGRect) to draw your icon image using rendering mode .alwaysTemplate on it:

extension UIImage {
    func tinted(with color: UIColor) -> UIImage? {
        UIGraphicsBeginImageContextWithOptions(size, false, scale)
        defer { UIGraphicsEndImageContext() }
        color.set()
        withRenderingMode(.alwaysTemplate)
            .draw(in: CGRect(origin: .zero, size: size))
        return UIGraphicsGetImageFromCurrentImageContext()
    }
}

---

Solution 2

If you use PNG images (as i think because of icons) - just use:

let originalImage = UIImage(named: "iconName")
let tintedImage = originalImage?.withRenderingMode(.alwaysTemplate)
yourButton.setImage(tintedImage, forState: .normal)
yourButton.tintColor = UIColor.blue //change color of icon

Solution 3

iOS 13 and above (Swift 5.1):

Declaration (see Docs)

func withTintColor(_ color: UIColor) -> UIImage

usage:

yourUIImage.withTintColor(color: UIColor)

Comments

[Josh Homann]

template image works with pdf too. You should change the rendering mode in the asset catlog when you import the resource.

[TJBlack31]

@derdida Thank you for your answer. This is actually for a Google Maps marker. Is there similar functionality in that I could use?

[derdida]

As i checked in the docu, it should work with: GMSMarker.markerImage(with: UIColor.blue) to change any color of an markerimage

[TJBlack31]

@derdida Thank you, but I think that is with the default marker icon, not my custom png

[derdida]

Use the example from leo, then you are able to recolor any image (and have it as UIImage) - then just replace the UIImage from the marker.

[TJBlack31]

outstanding! Thank you