TechnologiesSwiftUI

BorderedProminentButtonStyle struct

iOSmacOStvOSwatchOSvisionOSiOS 15.0+✓ renders

A button style that applies standard border prominent artwork based

How it works

BorderedProminentButtonStyle is a built-in ButtonStyle that draws a button with a filled, tinted background, giving it the most visual weight of the standard styles. Use it to mark the primary, recommended action in a view — the one place you want the user's eye to land and tap. Because it conforms to ButtonStyle, you apply it like any other style and let SwiftUI handle the platform-appropriate fill, shape, and pressed-state appearance for you. Reach for it when a call to action should stand out above ordinary bordered or borderless buttons.

  1. Apply it with the buttonStyle(_:) modifier

    BorderedProminentButtonStyle takes effect when you pass it to a button's buttonStyle(_:) modifier, which sets the style for that button and any buttons nested within the view. In the example, .buttonStyle(BorderedProminentButtonStyle()) attaches the style to the Button("Continue"), replacing the default appearance with a filled, prominent treatment.

  2. Construct it with its parameterless initializer

    The style is a struct with a single no-argument initializer, so BorderedProminentButtonStyle() is all you need — there are no configuration parameters. The appearance is derived from the environment (tint, control size, color scheme) rather than from init arguments, which is why the value type stays empty in .buttonStyle(BorderedProminentButtonStyle()).

  3. Prefer the .borderedProminent shorthand

    Because BorderedProminentButtonStyle conforms to ButtonStyle, SwiftUI exposes it as the static member .borderedProminent, letting the compiler infer the type from the modifier. The Button("Add to Cart") uses .buttonStyle(.borderedProminent), which is exactly equivalent to constructing the struct directly but reads more fluently in a modifier chain.

  4. Drive the fill color with tint(_:)

    The prominent style fills the button with the surrounding tint color rather than a fixed accent, so you recolor it from the environment instead of through the style itself. Adding .tint(.green) to the Button("Add to Cart") makes its filled background green, demonstrating how the same BorderedProminentButtonStyle adapts to whatever tint is in scope.

Try it — Add .controlSize(.large) after .buttonStyle(.borderedProminent) on the Button("Add to Cart") to see BorderedProminentButtonStyle scale its padding and filled shape up while keeping the prominent treatment.

Example & preview

Press Run live & edit to compile it in your browser — then edit the Swift on the left and the preview re-renders live.

BorderedProminentButtonStyle.swift
struct BorderedProminentButtonStyleDemo: View {
    var body: some View {
        VStack(spacing: 16) {
            Button("Continue") {}
                .buttonStyle(BorderedProminentButtonStyle())

            Button("Add to Cart") {}
                .buttonStyle(.borderedProminent)
                .tint(.green)
        }
        .padding()
    }
}
Live preview
Continue Add to Cart
Continue Add to Cart
swift → lexer → parser → sema → uiir → canvas Open in Studio ↗
What's new in SwiftUI 27 →