TechnologiesSwiftUI

PlaceholderTextShapeStyle struct

iOSmacOStvOSwatchOSvisionOSiOS 17.0+✓ renders

A style appropriate for placeholder text.

How it works

PlaceholderTextShapeStyle is the shape style SwiftUI uses to render content with the system's standard placeholder treatment — the muted, de-emphasized fill normally seen behind hint text in an empty field. Rather than hard-coding a gray color, reach for it whenever you want text or symbols to read as a prompt or stand-in for absent content, and let the framework supply the correct appearance for the current context, vibrancy, and color scheme. Like the other built-in styles, you rarely name the type directly; you apply it through the placeholder accessor on a foreground or fill style, keeping your UI aligned with the platform's evolving placeholder semantics.

  1. Apply it through the placeholder shape-style accessor

    PlaceholderTextShapeStyle conforms to ShapeStyle, so it participates anywhere a style is expected. You almost never write its name: instead use the static .placeholder member, which resolves to an instance of this type. In the example, both the "Search" text and the person.crop.circle image pass .placeholder to identify the style to use.

  2. Drive foreground content with foregroundStyle(.placeholder)

    The primary entry point is foregroundStyle(_:), which paints a view's foreground using the style you hand it. Supplying .placeholder renders the content with the placeholder fill — the same treatment the system applies to empty-field prompts. Here Text("Search") becomes a muted hint, signaling it stands in for content the user has not yet provided.

  3. Style symbols the same way as text

    Because PlaceholderTextShapeStyle is a general ShapeStyle, it is not limited to Text. The example feeds .placeholder to foregroundStyle on an Image(systemName:), so the person.crop.circle glyph picks up the identical de-emphasized appearance, letting a symbol act as a visual placeholder alongside placeholder text.

  4. Contrast it with emphasized styles to see its role

    Placeholder content is meant to recede next to real content. The example sets that contrast deliberately: the "Jane Appleseed" line uses .font(.title3.bold()) with the default foreground, so it reads as committed content, while the .placeholder-styled "Search" and avatar sit quietly behind it — exactly the hierarchy this style exists to express.

Try it — Change .foregroundStyle(.placeholder) on the "Search" text to .foregroundStyle(.primary) and watch the muted hint snap to full-strength foreground, revealing how much PlaceholderTextShapeStyle de-emphasizes the content.

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.

PlaceholderTextShapeStyle.swift
struct PlaceholderTextShapeStyleDemo: View {
    var body: some View {
        VStack(alignment: .leading, spacing: 12) {
            Text("Search")
                .foregroundStyle(.placeholder)
            Text("Jane Appleseed")
                .font(.title3.bold())
            Image(systemName: "person.crop.circle")
                .font(.largeTitle)
                .foregroundStyle(.placeholder)
        }
        .padding()
    }
}
Live preview
Search Jane Appleseed
Search Jane Appleseed
swift → lexer → parser → sema → uiir → canvas Open in Studio ↗
What's new in SwiftUI 27 →