From a blank screen to your first SwiftUI view

Tech2Apple editorial · Source-based guide · Updated October 2026

A SwiftUI view describes part of an interface. Start with something small enough to understand: a title, a symbol, and a little space around them.

Create a starting project

In Xcode on your Mac, create an app project using SwiftUI. Open the generated ContentView file. Keep the project’s app entry point and replace only the ContentView declaration with this example.

import SwiftUI

struct ContentView: View {
    var body: some View {
        VStack(spacing: 16) {
            Image(systemName: "sparkles")
                .font(.largeTitle)
            Text("Made by you.")
                .font(.title)
        }
        .padding()
    }
}

Read it from the inside out

Text creates a label. Image displays a system symbol. VStack arranges those views vertically. The spacing argument controls the gap, and padding adds space around the group. Modifiers such as font describe how a view is presented.

Make one change at a time

Change the text, adjust the spacing, and preview again. Then add a second text view below the first. This helps connect your code to what appears on screen before you add state, networking, or storage.

Sources: Xcode · SwiftUI learning resources · Apple’s Swift Playgrounds video.