Cocoa Touch How To Change UIView's Border Color And Thickness?
Master System Design with Codemia
Enhance your system design skills with over 120 practice problems, detailed solutions, and hands-on exercises.
Introduction
UIView does not expose border settings directly on the view itself. Border appearance is controlled through the underlying CALayer, which is why the solution usually involves view.layer.borderWidth and view.layer.borderColor.
Change a border with CALayer
Every UIView has a backing layer. That layer is responsible for low-level drawing attributes such as borders, corner radius, shadows, and transforms.
In Swift, the basic setup looks like this:
Two details matter here:
- '
borderWidthuses points, not pixels' - '
borderColorexpects aCGColor, not aUIColor'
That is why .cgColor is required.
Apply border styling in a custom view
If the same style should be applied every time a view is created, place it in a subclass rather than repeating border code across controllers.
This approach keeps the styling logic close to the view and makes Interface Builder and programmatic layouts behave consistently.
Update border color dynamically
You can also change border appearance in response to state changes such as validation, focus, or selection.
That pattern is common for form fields, cards, and custom controls. If the border is tied to user interaction, update it on the main thread because UIKit is not thread-safe.
Interface Builder and @IBInspectable
If designers or other developers need to change border styling in Interface Builder, expose the properties through @IBInspectable.
Now the border can be changed visually in storyboard or xib files without writing controller code for every instance.
Border thickness, corner radius, and clipping
Borders usually look better when they match the corner radius of the view. If you are rounding corners, set the radius on the same layer that owns the border.
clippedToBounds or masksToBounds is often needed when the view’s content should follow the rounded corners. Without it, the border may be rounded while the content still draws as a rectangle.
Common Pitfalls
The most common mistake is assigning a UIColor directly to borderColor. The layer expects CGColor, so the correct form is UIColor.red.cgColor.
Another issue is changing border appearance before the view hierarchy is fully set up, then assuming Auto Layout broke something. Border width and color do not depend on layout, but related styling such as shadows, masks, or custom paths sometimes does. If appearance depends on final bounds, move that work to layoutSubviews().
Developers also forget about retina scaling and choose border widths like 0.3 or 0.7, which can render inconsistently. Whole-number or half-point widths usually look cleaner.
Finally, watch the interaction between rounded corners and shadows. A layer with masking enabled clips its shadow. If you need both a clipped rounded content area and a shadow, use a wrapper view: one layer for the shadow, another for the clipped border.
Summary
- Change a
UIViewborder through itslayer. - Use
borderWidthfor thickness andborderColorwith aCGColor. - Put reusable border styling in a custom view or helper method.
- '
@IBInspectableis useful when the border should be configurable in Interface Builder.' - Coordinate border settings with corner radius and clipping so the final result renders correctly.

