Change UIButton BorderColor in Storyboard

For Swift:

Swift 3:

extension UIView {    @IBInspectable var cornerRadius: CGFloat {        get {            return layer.cornerRadius        }        set {            layer.cornerRadius = newValue            layer.masksToBounds = newValue > 0        }    }    @IBInspectable var borderWidth: CGFloat {        get {            return layer.borderWidth        }        set {            layer.borderWidth = newValue        }    }    @IBInspectable var borderColor: UIColor? {        get {            return UIColor(cgColor: layer.borderColor!)        }        set {            layer.borderColor = newValue?.cgColor        }    }}

Swift 2.2:

extension UIView {    @IBInspectable var cornerRadius: CGFloat {        get {            return layer.cornerRadius        }        set {            layer.cornerRadius = newValue            layer.masksToBounds = newValue > 0        }    }    @IBInspectable var borderWidth: CGFloat {        get {            return layer.borderWidth        }        set {            layer.borderWidth = newValue        }    }    @IBInspectable var borderColor: UIColor? {        get {            return UIColor(CGColor: layer.borderColor!)        }        set {            layer.borderColor = newValue?.CGColor        }    }}

I got answer. Change borderColor instead of layer.borderColor:

and add this code in .m file:

#import <QuartzCore/QuartzCore.h>@implementation CALayer (Additions)- (void)setBorderColorFromUIColor:(UIColor *)color{    self.borderColor = color.CGColor;}@end

Tick properties in Attribute Inspector

Swift 4, Xcode 9.2 - Use IBDesignable and IBInspectable to build custom controls and live preview the design in Interface Builder.

Here is a sample code in Swift, place just below the UIKit in ViewController.swift:

@IBDesignable extension UIButton {    @IBInspectable var borderWidth: CGFloat {        set {            layer.borderWidth = newValue        }        get {            return layer.borderWidth        }    }    @IBInspectable var cornerRadius: CGFloat {        set {            layer.cornerRadius = newValue        }        get {            return layer.cornerRadius        }    }    @IBInspectable var borderColor: UIColor? {        set {            guard let uiColor = newValue else { return }            layer.borderColor = uiColor.cgColor        }        get {            guard let color = layer.borderColor else { return nil }            return UIColor(cgColor: color)        }    }}

If you go to the Attributes inspectable of the view, you should find these properties visually, edit the properties:

The changes are also reflected in User Defined Runtime Attributes:

Run in build time and Voila! you will see your clear rounded button with border.