How to recolor UIImages using template images and withRenderingMode()

Written by Paul Hudson    @twostraws

Template images are the iOS 7.0 way of tinting any kind of image when it's inside a UIImageView. This is usually used to mimic the tinting of button images (as seen in toolbars and tab bars) but it works anywhere you want to dynamically recolor an image.

To get started, load an image then call withRenderingMode() on it, like this:

if let myImage = UIImage(named: "myImage") {
    let tintableImage = myImage.withRenderingMode(.alwaysTemplate)
    imageView.image = tintableImage
}

The tint color of a UIImageView is the standard iOS 7 blue by default, but you can change it easily enough:

imageView.tintColor = UIColor.red

Available from iOS 7.0

Did this solution work for you? Please pass it on!

Tweet

Other people are reading…

• How to position a view using Auto Layout anchors
• How to set prompt text in a navigation bar
• What is a view’s intrinsic content size?
• How to run JavaScript on a UIWebView with stringByEvaluatingJavaScript(from:)
• How to add scopes to a UISearchController

About the Swift Knowledge Base

This is part of the Swift Knowledge Base, a free, searchable collection of solutions for common iOS questions.