--- title: "Button Components | Explore SwiftUI" description: "A control that initiates an action. Explore 11 SwiftUI button components with code examples for iOS, macOS, watchOS, tvOS, and visionOS." canonical_url: "https://exploreswiftui.com/library/button" meta: author: "Explore SwiftUI" "og:description": "A control that initiates an action. Explore 11 SwiftUI button components with code examples for iOS, macOS, watchOS, tvOS, and visionOS." "og:image": "https://exploreswiftui.com/_og/d/c_Default%2Ctitle_Button%2BComponents%2Cdescription_Explore%2B11%2BSwiftUI%2Bcomponents%2Bvisually%2Cp_Ii9saWJyYXJ5L2J1dHRvbiI%2Cs_MQFGJOPvdMIq0aAH.png" "og:image:height": "630" "og:image:type": image/png "og:image:width": "1200" "og:title": "Button Components | Explore SwiftUI" "twitter:description": "A control that initiates an action. Explore 11 SwiftUI button components with code examples for iOS, macOS, watchOS, tvOS, and visionOS." "twitter:image": "https://exploreswiftui.com/_og/d/c_Default%2Ctitle_Button%2BComponents%2Cdescription_Explore%2B11%2BSwiftUI%2Bcomponents%2Bvisually%2Cp_Ii9saWJyYXJ5L2J1dHRvbiI%2Cs_MQFGJOPvdMIq0aAH.png" "twitter:title": "Button Components | Explore SwiftUI" --- > Index of every page on this site: [llms.txt](https://exploreswiftui.com/llms.txt) # **Button Components** A control that initiates an action. 11 components ![Role Button With Default Label - iOS on iPhone - Portrait - Liquid Glass - Light Mode - Preview](https://exploreswiftui.com/api/images/134/variants/424?v=1790073478842&r=2&w=412&q=75&f=webp) ### **Role Button With Default Label** Creates a button that displays a default label. ![Button - iOS on iPhone - Portrait - Liquid Glass - Light Mode - Preview](https://exploreswiftui.com/api/images/30/variants/175?v=1790073478842&r=2&w=412&q=75&f=webp) ### **Button** Three ways to initialize a button ![Glass Button Styles - iOS on iPhone - Portrait - Liquid Glass - Light Mode - Preview](https://exploreswiftui.com/api/images/87/variants/314?v=1790073478842&r=2&w=412&q=75&f=webp) ### **Glass Button Styles** A button style that applies glass border artwork based on the button’s context ![Button Tint - iOS on iPhone - Portrait - Liquid Glass - Light Mode - Preview](https://exploreswiftui.com/api/images/34/variants/408?v=1790073478842&r=2&w=412&q=75&f=webp) ### **Button Tint** Sets the buttons tint color ![Button Roles - iOS on iPhone - Portrait - Liquid Glass - Light Mode - Preview](https://exploreswiftui.com/api/images/33/variants/718?v=1790073478842&r=2&w=412&q=75&f=webp) ### **Button Roles** A value that describes the purpose of a button. ![Button Styles - iOS on iPhone - Portrait - Liquid Glass - Light Mode - Preview](https://exploreswiftui.com/api/images/31/variants/339?v=1790073478842&r=2&w=412&q=75&f=webp) ### **Button Styles** A type that applies standard interaction behavior and a custom appearance to all buttons within a view hierarchy ![Button Sizing - iOS on iPhone - Portrait - Liquid Glass - Light Mode - Preview](https://exploreswiftui.com/api/images/190/variants/3?v=1790073478842&r=2&w=412&q=75&f=webp) ### **Button Sizing** The preferred sizing behavior of buttons in the view hierarchy. ![RenameButton - iOS on iPhone - Portrait - Liquid Glass - Light Mode - Preview](https://exploreswiftui.com/api/images/37/variants/213?v=1790073478842&r=2&w=412&q=75&f=webp) ### **RenameButton** A button that triggers a standard rename action ![EditButton - iOS on iPhone - Portrait - Liquid Glass - Light Mode - Preview](https://exploreswiftui.com/api/images/36/variants/239?v=1790073478842&r=2&w=412&q=75&f=webp) ### **EditButton** A button that toggles the edit mode environment value ![PasteButton - iOS on iPhone - Portrait - Liquid Glass - Light Mode - Preview](https://exploreswiftui.com/api/images/35/variants/235?v=1790073478842&r=2&w=412&q=75&f=webp) ### **PasteButton** A system button that reads items from the pasteboard and delivers it to a closure. ![Button Border Shape - iOS on iPhone - Portrait - Liquid Glass - Light Mode - Preview](https://exploreswiftui.com/api/images/32/variants/179?v=1790073478842&r=2&w=412&q=75&f=webp) ### **Button Border Shape** A shape used to draw a button’s border. ```json {"@context":"https://schema.org","@graph":[{"@id":"https://exploreswiftui.com/#website","@type":"WebSite","description":"A visual library for SwiftUI APIs, components, and modifiers","inLanguage":"en-US","name":"Explore SwiftUI","url":"https://exploreswiftui.com/","publisher":{"@id":"https://exploreswiftui.com/#identity"}},{"@id":"https://exploreswiftui.com/library/button#webpage","@type":"WebPage","description":"A control that initiates an action. Explore 11 SwiftUI button components with code examples for iOS, macOS, watchOS, tvOS, and visionOS.","name":"Button Components","url":"https://exploreswiftui.com/library/button","breadcrumb":{"@id":"https://exploreswiftui.com/library/button#breadcrumb"},"isPartOf":{"@id":"https://exploreswiftui.com/#website"},"potentialAction":[{"@type":"ReadAction","target":["https://exploreswiftui.com/library/button"]}],"primaryImageOfPage":{"@id":"https://exploreswiftui.com/#logo"}},{"@id":"https://exploreswiftui.com/#identity","@type":"Organization","description":"A visual library for SwiftUI APIs, components, and modifiers","name":"Explore SwiftUI","url":"https://exploreswiftui.com","logo":{"@id":"https://exploreswiftui.com/#logo"},"sameAs":["https://x.com/Typ0genius","https://mastodon.social/@Typ0genius"]},{"@id":"https://exploreswiftui.com/library/button#collectionpage","@type":"CollectionPage","description":"A control that initiates an action. Explore 11 SwiftUI button components with code examples for iOS, macOS, watchOS, tvOS, and visionOS.","inLanguage":"en-US","name":"Button Components","url":"https://exploreswiftui.com/library/button","about":{"@type":"Thing","name":"SwiftUI"},"isPartOf":{"@id":"https://exploreswiftui.com/#website"}},{"@id":"https://exploreswiftui.com/library/button#/schema/item-list/1","@type":"ItemList","name":"Button Components","itemListElement":[{"@type":"ListItem","position":1,"name":"Role Button With Default Label","url":"https://exploreswiftui.com/library/button/role-button-with-default-label"},{"@type":"ListItem","position":2,"name":"Button","url":"https://exploreswiftui.com/library/button/button"},{"@type":"ListItem","position":3,"name":"Glass Button Styles","url":"https://exploreswiftui.com/library/button/glass-button-styles"},{"@type":"ListItem","position":4,"name":"Button Tint","url":"https://exploreswiftui.com/library/button/button-tint"},{"@type":"ListItem","position":5,"name":"Button Roles","url":"https://exploreswiftui.com/library/button/button-roles"},{"@type":"ListItem","position":6,"name":"Button Styles","url":"https://exploreswiftui.com/library/button/button-styles"},{"@type":"ListItem","position":7,"name":"Button Sizing","url":"https://exploreswiftui.com/library/button/button-sizing"},{"@type":"ListItem","position":8,"name":"RenameButton","url":"https://exploreswiftui.com/library/button/renamebutton"},{"@type":"ListItem","position":9,"name":"EditButton","url":"https://exploreswiftui.com/library/button/editbutton"},{"@type":"ListItem","position":10,"name":"PasteButton","url":"https://exploreswiftui.com/library/button/pastebutton"},{"@type":"ListItem","position":11,"name":"Button Border Shape","url":"https://exploreswiftui.com/library/button/button-border-shape"}]},{"@id":"https://exploreswiftui.com/library/button#breadcrumb","@type":"BreadcrumbList","itemListElement":[{"@type":"ListItem","name":"Home","item":"https://exploreswiftui.com","position":1},{"@type":"ListItem","name":"Button","item":"https://exploreswiftui.com/library/button","position":2}]},{"@id":"https://exploreswiftui.com/#logo","@type":"ImageObject","caption":"Explore SwiftUI","contentUrl":"https://exploreswiftui.com/apple-touch-icon.png","inLanguage":"en","url":"https://exploreswiftui.com/apple-touch-icon.png"}]} ```