--- title: "Divider Height | Explore SwiftUI" description: "Customizing the height of the Divider. Learn how to use Divider Height in SwiftUI with visual code examples for iOS, macOS, watchOS, tvOS, and visionOS." canonical_url: "https://exploreswiftui.com/library/divider/divider-height" meta: author: "Explore SwiftUI" "og:description": "Customizing the height of the Divider. Learn how to use Divider Height in SwiftUI with visual code examples for iOS, macOS, watchOS, tvOS, and visionOS." "og:image": "https://exploreswiftui.com/_og/d/c_Component%2Ctitle_Divider%2BHeight%2Cdescription_Customizing%2Bthe%2Bheight%2Bof%2Bthe%2BDivider%2Ccategory_Divider%2Cimage_~L2FwaS9pbWFnZXMvNzIvdmFyaWFudHMvMTY3P3Y9MTc5MDA3MzQ3ODg0MiZyPTImdz0xMjgwJnE9ODUmZj1qcGVn%2CimageMode_crop%2CimagePosition_center%2CimageFrame_~cG9zaXRpb246IGFic29sdXRlOyByaWdodDogMDsgd2lkdGg6IDY0MHB4OyBoZWlnaHQ6IDQ4MHB4OyBkaXNwbGF5OiBmbGV4OyBvdmVyZmxvdzogaGlkZGVuOyBiYWNrZ3JvdW5kOiAjRkZGRkZGOyBib3gtc2hhZG93OiAwIC0xMHB4IDUwcHggcmdiYSgzNyw5OSwyMzUsMC4xOCk7IGJvcmRlci1sZWZ0OiAxcHggc29saWQgcmdiYSgwLDAsMCwwLjA2KTsgdG9wOiA3NXB4OyBib3JkZXItdG9wOiAxcHggc29saWQgcmdiYSgwLDAsMCwwLjA2KTsgYm9yZGVyLWJvdHRvbTogMXB4IHNvbGlkIHJnYmEoMCwwLDAsMC4wNik7IGJvcmRlci10b3AtbGVmdC1yYWRpdXM6IDMycHg7IGJvcmRlci1ib3R0b20tbGVmdC1yYWRpdXM6IDMycHg7%2Cprops_eyJwbGF0Zm9ybXMiOlsiaU9TIiwiaVBhZE9TIiwibWFjT1MiLCJ3YXRjaE9TIiwidHZPUyIsInZpc2lvbk9TIl19%2Cp_Ii9saWJyYXJ5L2RpdmlkZXIvZGl2aWRlci1oZWlnaHQi%2Cs_kLAuiEXkKd9oL8pA.png" "og:image:height": "630" "og:image:type": image/png "og:image:width": "1200" "og:title": "Divider Height | Explore SwiftUI" "twitter:description": "Customizing the height of the Divider. Learn how to use Divider Height in SwiftUI with visual code examples for iOS, macOS, watchOS, tvOS, and visionOS." "twitter:image": "https://exploreswiftui.com/_og/d/c_Component%2Ctitle_Divider%2BHeight%2Cdescription_Customizing%2Bthe%2Bheight%2Bof%2Bthe%2BDivider%2Ccategory_Divider%2Cimage_~L2FwaS9pbWFnZXMvNzIvdmFyaWFudHMvMTY3P3Y9MTc5MDA3MzQ3ODg0MiZyPTImdz0xMjgwJnE9ODUmZj1qcGVn%2CimageMode_crop%2CimagePosition_center%2CimageFrame_~cG9zaXRpb246IGFic29sdXRlOyByaWdodDogMDsgd2lkdGg6IDY0MHB4OyBoZWlnaHQ6IDQ4MHB4OyBkaXNwbGF5OiBmbGV4OyBvdmVyZmxvdzogaGlkZGVuOyBiYWNrZ3JvdW5kOiAjRkZGRkZGOyBib3gtc2hhZG93OiAwIC0xMHB4IDUwcHggcmdiYSgzNyw5OSwyMzUsMC4xOCk7IGJvcmRlci1sZWZ0OiAxcHggc29saWQgcmdiYSgwLDAsMCwwLjA2KTsgdG9wOiA3NXB4OyBib3JkZXItdG9wOiAxcHggc29saWQgcmdiYSgwLDAsMCwwLjA2KTsgYm9yZGVyLWJvdHRvbTogMXB4IHNvbGlkIHJnYmEoMCwwLDAsMC4wNik7IGJvcmRlci10b3AtbGVmdC1yYWRpdXM6IDMycHg7IGJvcmRlci1ib3R0b20tbGVmdC1yYWRpdXM6IDMycHg7%2Cprops_eyJwbGF0Zm9ybXMiOlsiaU9TIiwiaVBhZE9TIiwibWFjT1MiLCJ3YXRjaE9TIiwidHZPUyIsInZpc2lvbk9TIl19%2Cp_Ii9saWJyYXJ5L2RpdmlkZXIvZGl2aWRlci1oZWlnaHQi%2Cs_kLAuiEXkKd9oL8pA.png" "twitter:title": "Divider Height | Explore SwiftUI" --- > Index of every page on this site: [llms.txt](https://exploreswiftui.com/llms.txt) **Interactive previews**[ iPhone](https://exploreswiftui.com/iphone?element=72) # **Divider Height** Customizing the height of the Divider ![Divider Height - iOS on iPhone - Portrait - Liquid Glass - Light Mode - Preview](https://exploreswiftui.com/api/images/72/variants/167?v=1790073478842&r=2&w=800&q=80&f=webp) ### **Platform Compatibility** iOS 13.0+ iPadOS 13.0+ macOS 10.15+ watchOS 6.0+ tvOS 13..0+ visionOS 1.0+ ### **Tags** ### **SwiftUI Code** [ Docs](https://developer.apple.com/documentation/swiftui/divider) ``` Divider() .frame(height: 5) .overlay(.brown) ``` ### **Found an issue or have a suggestion?** Created: June 5, 2025Updated: December 27, 2025 ![Connect Wizard](https://exploreswiftui.com/_ipx/f_webp&q_80&s_48x48/images/connect-wizard-icon.png) **Connect Wizard** **Unlock insights App Store Connect doesn’t show you.** [** Get Started **](https://apps.apple.com/app/apple-store/id6747314580?pt=121213751&ct=Explore%20SwiftUI%20Banner&mt=8) ### **More Divider Components ** [**View all **](https://exploreswiftui.com/library/divider) ![Divider Color - iOS on iPhone - Portrait - Liquid Glass - Light Mode - Preview](https://exploreswiftui.com/api/images/71/variants/110?v=1790073478842&r=2&w=412&q=75&f=webp) ### **Divider Color** Customizing the color of the Divider ![Vertical Divider - iOS on iPhone - Portrait - Liquid Glass - Light Mode - Preview](https://exploreswiftui.com/api/images/70/variants/61?v=1790073478842&r=2&w=412&q=75&f=webp) ### **Vertical Divider** A vertical visual element that can be used to separate other content ![Divider - iOS on iPhone - Portrait - Liquid Glass - Light Mode - Preview](https://exploreswiftui.com/api/images/69/variants/69?v=1790073478842&r=2&w=412&q=75&f=webp) ### **Divider** A visual element that can be used to separate other content ### **Explore Other Components ** [**Browse all **](https://exploreswiftui.com/) ![Placeholder Icon Product View - iOS on iPhone - Portrait - Liquid Glass - Light Mode - Preview](https://exploreswiftui.com/api/images/204/variants/553?v=1790073478842&r=2&w=412&q=75&f=webp) ### **Placeholder Icon Product View** Creates a view to load an individual product from the App Store, and merchandise it using its promotional image and a custom placeholder icon. ![Toolbar Title Alignment - iOS on iPhone - Portrait - Liquid Glass - Light Mode - Preview](https://exploreswiftui.com/api/images/258/variants/2111?v=1793542963212&r=2&w=412&q=75&f=webp) ### **Toolbar Title Alignment** Sets the preferred alignment of the navigation bar’s title. The navigation bar resolves the alignment of its title automatically based on context, and toolbar roles. Use this modifier to override that resolution. ![ControlSize - iOS on iPhone - Portrait - Liquid Glass - Light Mode - Preview](https://exploreswiftui.com/api/images/97/variants/303?v=1790073478842&r=2&w=412&q=75&f=webp) ### **ControlSize** A control version that is the default size ![Content NavigationSplitView - iOS on iPhone Duo - Landscape - Fully Open - Liquid Glass - Light Mode - Preview](https://exploreswiftui.com/api/images/242/variants/1528?v=1790273533713&r=2&w=412&q=75&f=webp) ### **Content NavigationSplitView** Creates a three-column navigation split view. ![NavigationSplitView - iOS on iPhone - Portrait - Liquid Glass - Light Mode - Preview](https://exploreswiftui.com/api/images/241/variants/1983?v=1791379705544&r=2&w=412&q=75&f=webp) ### **NavigationSplitView** Creates a two-column navigation split view. ![Link - iOS on iPhone - Portrait - Liquid Glass - Light Mode - Preview](https://exploreswiftui.com/api/images/73/variants/207?v=1790073478842&r=2&w=412&q=75&f=webp) ### **Link** A control for navigating to a URL ![VerticalPageTabViewStyle - watchOS - Liquid Glass - Light Mode - Preview](https://exploreswiftui.com/api/images/162/variants/463?v=1790073478842&r=2&w=412&q=75&f=webp) ### **VerticalPageTabViewStyle** A TabViewStyle that displays a vertical TabView interaction and appearance. ![Default Tab Bar Placement - iOS on iPhone - Portrait - Liquid Glass - Light Mode - Preview](https://exploreswiftui.com/api/images/239/variants/2069?v=1792681374978&r=2&w=412&q=75&f=webp) ### **Default Tab Bar Placement** Specifies the preferred placement for the tabs of a TabView in the sidebarAdaptable style on platforms where the tab bar cannot adapt between different representations, and only one representation can be shown. For example, on iOS, it can enforce the sidebar on large-screen devices like the Pro Max, and iPhone Duo. This modifier has no effect on iPadOS. ```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/divider/divider-height#webpage","@type":"WebPage","dateModified":"2025-12-27T14:00:04.238Z","datePublished":"2025-06-05T11:34:12.913Z","description":"Customizing the height of the Divider. Learn how to use Divider Height in SwiftUI with visual code examples for iOS, macOS, watchOS, tvOS, and visionOS.","name":"Divider Height","url":"https://exploreswiftui.com/library/divider/divider-height","breadcrumb":{"@id":"https://exploreswiftui.com/library/divider/divider-height#breadcrumb"},"isPartOf":{"@id":"https://exploreswiftui.com/#website"},"potentialAction":[{"@type":"ReadAction","target":["https://exploreswiftui.com/library/divider/divider-height"]}],"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/divider/divider-height#article","dateModified":"2025-12-27T14:00:04.238Z","datePublished":"2025-06-05T11:34:12.913Z","description":"Customizing the height of the Divider. Learn how to use Divider Height in SwiftUI with visual code examples for iOS, macOS, watchOS, tvOS, and visionOS.","headline":"Divider Height","inLanguage":"en-US","name":"Divider Height","thumbnailUrl":"https://exploreswiftui.com/api/images/72/variants/167?v=1790073478842&r=2","url":"https://exploreswiftui.com/library/divider/divider-height","@type":["Article","TechArticle"],"about":{"@type":"Thing","name":"SwiftUI"},"author":{"@id":"https://exploreswiftui.com/#identity"},"image":{"@id":"https://exploreswiftui.com/#/schema/image/1"},"isPartOf":{"@type":"WebSite","name":"Explore SwiftUI","url":"https://exploreswiftui.com"},"mainEntityOfPage":{"@id":"https://exploreswiftui.com/library/divider/divider-height#webpage"},"publisher":{"@id":"https://exploreswiftui.com/#identity"}},{"@id":"https://exploreswiftui.com/library/divider/divider-height#/schema/software-source-code/1","@type":"SoftwareSourceCode","codeRepository":"https://developer.apple.com/documentation/swiftui/divider","codeSampleType":"full example","description":"Customizing the height of the Divider. Learn how to use Divider Height in SwiftUI with visual code examples for iOS, macOS, watchOS, tvOS, and visionOS.","name":"Divider Height SwiftUI Example","programmingLanguage":"Swift","runtimePlatform":"SwiftUI","text":"Divider()\n .frame(height: 5)\n .overlay(.brown)\n","about":[{"@type":"Thing","name":"SwiftUI"},{"@type":"Thing","name":"Divider"},{"@type":"Thing","name":"Divider Height"}]},{"@id":"https://exploreswiftui.com/library/divider/divider-height#breadcrumb","@type":"BreadcrumbList","itemListElement":[{"@type":"ListItem","name":"Home","item":"https://exploreswiftui.com","position":1},{"@type":"ListItem","name":"Divider","item":"https://exploreswiftui.com/library/divider","position":2},{"@type":"ListItem","name":"Divider Height","item":"https://exploreswiftui.com/library/divider/divider-height","position":3}]},{"@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"},{"@id":"https://exploreswiftui.com/#/schema/image/1","@type":"ImageObject","contentUrl":"https://exploreswiftui.com/api/images/72/variants/167?v=1790073478842&r=2","inLanguage":"en","url":"https://exploreswiftui.com/api/images/72/variants/167?v=1790073478842&r=2"}]} ```