UIColor to Hex Converter

The Formula for Converting UIColor to Hex in Swift

To convert a UIColor to a hex code, every channel follows the same rule. For a component c between 0 and 1, the 8-bit channel value is:

$$\text{channel} = \text{round}(c \times 255)$$

Split that channel into a high and a low digit to get its two hex characters:

$$\text{hex} = 16 \times d_{1} + d_{2}, \quad d_{1} = \lfloor \text{channel} \div 16 \rfloor, \; d_{2} = \text{channel} \bmod 16$$

Decimal digits above 9 are written as A through F, so 14 becomes E and 10 becomes A. Joining the red, green and blue pairs behind a hash gives the final hex code.

Converting UIColor to Hex Inside Your Own Code

If you would rather keep the logic in your project, a short extension does the same thing. It reads the four CGFloat components and formats them as two-digit uppercase pairs:

extension UIColor {
    func toHexString(withAlpha: Bool = false) -> String? {
        var r: CGFloat = 0, g: CGFloat = 0, b: CGFloat = 0, a: CGFloat = 0
        guard getRed(&r, green: &g, blue: &b, alpha: &a) else { return nil }
        let rgb = [r, g, b].map { Int(($0 * 255).rounded()) }
        let base = String(format: "#%02X%02X%02X", rgb[0], rgb[1], rgb[2])
        return withAlpha ? base + String(format: "%02X", Int((a * 255).rounded())) : base
    }
}

Call toHexString() on any color and the method returns nil when the color lives in a color space that cannot express RGB, such as a pattern image. On a plain RGB color it gives the same answer as the converter above, so you can convert UIColor to hex both online and at runtime.

Rounding or Truncating: Why a Hex Color Can Be Off by One

When you convert a UIColor to hex in Swift, some snippets cut the scaled component's decimals off with Int() instead of rounding. For the green above, truncation turns 45.90 into 45 and 119.85 into 119, producing #2D9E77 instead of #2E9E78. The two shades differ by a single step in two channels, which is invisible on screen but enough to fail an exact match in a design review or a snapshot test.

Rounding to the nearest integer is the safer default, because it is the inverse of dividing by 255 when you convert back. The converter rounds each UIColor component, so its output round-trips cleanly and may differ from a truncating snippet.

Hex to UIColor: Reverse Conversion in Swift and Objective-C

Going the other way is just as common. A hex to uicolor conversion splits the string into pairs, reads each pair as a number from 0 to 255 and divides by 255. Take #2E9E78: 2E is 46, 9E is 158 and 78 is 120, giving roughly 0.180, 0.620 and 0.471.

• In Swift, write a failable initializer that returns nil when the string is malformed.
• In Objective-C, a category on the UIColor class, with a method such as colorWithHex:, accepts a 32-bit integer and builds the color for you, and a CSS string helper can accept text like #2E9E78.
• In Xamarin, use the framework color helpers and pass the same red, green and blue numbers.

When you need a hex color to UIColor result without writing a parser, a hex to uicolor converter does the splitting for you. To convert a hex color to UIColor in code, accept the #RGB shorthand too: each digit is doubled, so #3A9 expands to #33AA99. Always strip the optional hashmark prefix before scanning, and let the scanner reject anything that is not a valid hex digit.

Which Hex Strings Are Valid

A UIKit parser should accept three lengths: 3 digits for #RGB, 6 for #RRGGBB and 8 for #RRGGBBAA. Anything else, such as five digits, should return nil instead of guessing. A default fallback color is fine for a UI, but silently hiding a typo makes bugs hard to trace.

How a Scanner Parses a Hex String Into a UIColor

To parse the text yourself, a Scanner reads the digits as one 64-bit number, and shifts and masks pull out each byte. This version is a convenience init that rejects anything but six digits:

extension UIColor {
    convenience init?(hexString: String) {
        var cleaned = hexString.trimmingCharacters(in: .whitespaces)
        if cleaned.hasPrefix("#") { cleaned.removeFirst() }
        let scanner = Scanner(string: cleaned)
        var value: UInt64 = 0
        guard cleaned.count == 6, scanner.scanHexInt64(&value) else { return nil }
        let r = CGFloat(UInt8((value >> 16) & 0xFF)) / 255
        let g = CGFloat(UInt8((value >> 8) & 0xFF)) / 255
        let b = CGFloat(UInt8(value & 0xFF)) / 255
        self.init(red: r, green: g, blue: b, alpha: 1)
    }
}

The scanner stops at the first character it cannot read, which is why the length check comes first. Any hexString with a stray letter fails the scan and returns nil, so a bad value never turns into a surprise color.

When to Convert a UIColor to a Hex Color Code

Designers usually hand over hex values, while developers write RGBA numbers in UIKit and SwiftUI. A converter closes that gap in seconds.

• Brand guidelines: keep brand colors identical across iOS, web and Android.
• Figma and Sketch: paste hex into fills and compare them with the values in your Xcode project.
• Debugging and prototyping: read the color from a running view, then reuse it in HTML or CSS.
• Cross-platform consistency: reuse one hex code in browsers, devices and design frameworks.
• Migration: move an old Interface Builder palette into named colors in an asset catalog without eyeballing swatches.

Converting UIColor values to a hexadecimal color keeps a mobile app and its web design on the same shade. Programmers and web development leads can write the hex color codes once in a style guide, then check each browser and device build for compatibility and UI consistency across apps, whether the accent is a gold highlight or the colour of a button. A digital handoff then starts from one value, and both teams reuse the same hex codes.

Doing this by copy and paste also supports pixel-perfect handoff: the tool shows a preview next to the code, so a wrong digit is obvious before it reaches the App Store build.