Skip to main content



A button that follows Dyte's Design System.


Creating a button.

public init(style: Style = .solid, dyteButtonState: States = .active, size: Size = .large, appearance: DyteButtonAppearance = DyteButtonAppearanceModel()) 

Creates DyteButton for the Style States Size you passed.


style: passed any type of Style. Default value of style is solid.
dyteButtonState: passed any type of States. Default value of states is active.
size: passed any type of Size. Default value of size is large.
appearance: Any type which conforms to protocol DyteButtonAppearance


public enum Style {
case solid
case line
case iconLeftLable(icon: DyteImage)
case iconRightLable(icon: DyteImage)
case text
case textIconLeft(icon: DyteImage)
case textIconRight(icon: DyteImage)
case iconOnly(icon: DyteImage)
case splitButton


public enum States
case active
case disabled
case hover
case focus
case pressed


public enum Size {
case small
case medium
case large

For example we can use DyteButton as follows

let dyteImage = DyteImage(image:ImageProvider.image(named: "icon_down_arrow"))
let downloadButton: DyteButton = {
let button = DyteButton(style: .iconOnly(icon: dyteImage),
dyteButtonState: .active)
button.backgroundColor = dyteSharedTokenColor.background.shade800
button.isUserInteractionEnabled = false
button.tintColor = .white
// Set additional button properties if needed
button.selectedStateTintColor = DesignLibrary.shared.color.status.danger
return button