Hex to SwiftUI Color
Convert a hex color like #2563EB into SwiftUI's Color(red:green:blue:) initializer with normalized 0.0-1.0 float components, ready for Swift view code.
How Hex to SwiftUI Color Conversion Works
SwiftUI's Color struct takes red, green, and blue as normalized floats between 0.0 and 1.0, the same convention UIKit's UIColor uses. This tool splits the hex code into its three channels, divides each by 255, and formats the result to 3 decimal places as a ready-to-paste Color(...) initializer for SwiftUI view code.
Hex to SwiftUI Color Example, Step by Step
#2563EB = Color(red: 0.145, green: 0.388, blue: 0.922)
#2563EB (hex) = Color(red: 0.145, green: 0.388, blue: 0.922)
Split into pairs: 25 | 63 | EB 25 (hex) = 37 -> 37 / 255 = 0.145 63 (hex) = 99 -> 99 / 255 = 0.388 EB (hex) = 235 -> 235 / 255 = 0.922
| Step | Description | Result |
|---|---|---|
| Split the hex code | #2563EB -> 25, 63, EB | 3 byte pairs |
| Convert to decimal | 25, 63, EB -> 37, 99, 235 | 37, 99, 235 |
| Normalize each channel | divide by 255 | 0.145, 0.388, 0.922 |
| Format as SwiftUI Color | Color(red:green:blue:) | Color(red: 0.145, green: 0.388, blue: 0.922) |
SwiftUI's Color is a value type used directly in view declarations, while UIColor is a reference type from UIKit — pick whichever matches the API you're calling.
Common Mistakes With Hex to SwiftUI Color
- Confusing SwiftUI's Color with UIKit's UIColor — they take the same normalized float inputs but aren't interchangeable types.
- Passing 0-255 integers directly into Color's red:green:blue: parameters instead of 0.0-1.0 floats.
- Expecting an alpha parameter — SwiftUI's Color(red:green:blue:) initializer omits it and defaults to fully opaque.
Frequently Asked Questions
How is SwiftUI's Color different from UIKit's UIColor?
SwiftUI's Color struct uses the same 0.0-1.0 normalized float convention as UIColor for its RGB components, but it's a value type designed for SwiftUI view code rather than UIKit's reference-type UIColor — different API surface, same underlying float math.
What's the SwiftUI Color value of #2563EB?
Color(red: 0.145, green: 0.388, blue: 0.922) — each channel divided by 255 and rounded to 3 decimal places.
Can I paste this directly into a SwiftUI view?
Yes, the output is valid Swift syntax for SwiftUI's Color initializer and drops directly into a View's body or a Color extension.
Does this tool convert SwiftUI Color back to hex too?
Not currently — this is a one-way, hex-to-SwiftUI conversion. For the reverse direction, use the Hex to UIColor tool and adapt the float values, since both use the same 0.0-1.0 scale.
Why doesn't the output include an alpha value?
SwiftUI's Color(red:green:blue:) initializer defaults opacity to 1.0 when it's omitted, so this tool leaves it out for a cleaner, fully opaque result.