How can I color a UIImage in Swift?
Master System Design with Codemia
Enhance your system design skills with over 120 practice problems, detailed solutions, and hands-on exercises.
Introduction
Coloring a UIImage can mean two different things on iOS: applying a tint to a template-style image, or actually redrawing the pixels into a new colored image. The best choice depends on whether you are working with icons and symbols or with full-color artwork that needs custom compositing.
Use template rendering for icons
If the image is a monochrome icon, the simplest solution is to mark it as a template image and let UIKit apply the tint color.
This is the usual answer for tab bar icons, toolbar items, and simple glyphs. Template rendering preserves the alpha channel and replaces the visible color with the tint color.
The same approach works on buttons:
If nothing changes visually, the most likely cause is that the image is still rendering as .alwaysOriginal or .automatic instead of .alwaysTemplate.
Use withTintColor when you need a new image
If you want a recolored UIImage value rather than relying on a view's tint at draw time, modern iOS provides withTintColor.
This is useful when:
- you need to cache the recolored result
- multiple views should display the exact same transformed image
- you do not want later tint-color changes in the view hierarchy to affect the image
It is also convenient when working with generated image assets outside the immediate UI component that will render them.
Redraw the image when tinting is not enough
Template tinting is ideal for simple icons, but it is not the right tool for every image. If you need more control, such as preserving image shading or compositing with a blend mode, redraw the image into a new graphics context.
This approach gives you an actual recolored bitmap. It is more flexible than template rendering, but it costs more work and more memory if you generate many variants.
Choose the method based on image type
A good rule is:
- use template rendering for monochrome UI icons
- use
withTintColorwhen you want a new recoloredUIImage - use custom drawing for advanced compositing or pixel-level control
If the source image is already multicolored or photorealistic, simply tinting it may not look good. In those cases, either redesign the asset or use a more deliberate image-processing pipeline.
This distinction is important because many developers try to force a full-color asset through template rendering and then wonder why the result looks flat or incorrect.
Common Pitfalls
- Setting
tintColoron the view but leaving the image in.alwaysOriginalmode. - Using template rendering on complex full-color artwork and expecting a high-quality recolor.
- Recreating tinted images repeatedly in scrolling views instead of caching or using view tinting.
- Forgetting that a tinted
UIImageViewcan inherit tint behavior from its parent view hierarchy. - Choosing a recoloring method without first deciding whether you need runtime tinting or a new bitmap image.
Summary
- For simple icons, the easiest solution is template rendering plus a view
tintColor. - '
withTintColoris useful when you want a new recoloredUIImagevalue.' - Custom drawing is the right tool when you need more control than template tinting allows.
- The rendering mode of the image matters just as much as the tint color you choose.
- Pick the technique based on whether the asset is a monochrome icon or a full bitmap image.

