# SwiftUI: spacing

> Learn how to add spacing between views in SwiftUI using the spacing parameter of a VStack, the Spacer view, and the frame modifier to size the gap.

Author: Flavio Copes | Published: 2021-09-16 | Canonical: https://flaviocopes.com/swiftui-spacing/

In the last [SwiftUI](https://flaviocopes.com/swiftui-introduction/) tutorial I mentioned how views can be arranged using stacks:

```swift
VStack {
    Text("Hello World")
    Text("Hello again!")
}
```

![Two text views in a VStack with no spacing between them, showing default behavior](https://flaviocopes.com/images/swiftui-spacing/Screen_Shot_2021-09-13_at_11.38.24.png)

Let's talk about spacing.

See how there's no space between the two `Text` views? That's because it's the default behavior of `VStack`.

`VStack` accepts a `spacing` parameter:

```swift
VStack(spacing: 100) {
    Text("Hello World")
    Text("Hello again!")
}
```

This puts a 100 points space between the views contained in the `VStack`.

![Two text views in a VStack with 100 points spacing between them](https://flaviocopes.com/images/swiftui-spacing/Screen_Shot_2021-09-13_at_11.38.02.png)

You can also use a `Spacer` view:

```swift
VStack {
    Text("Hello World")
    Spacer()
    Text("Hello again!")
}
```

`Spacer` fills all the available space as it can:
 
![Two text views with a Spacer filling all available space, pushing texts to top and bottom of screen](https://flaviocopes.com/images/swiftui-spacing/Screen_Shot_2021-09-13_at_12.20.26.png)

You can limit it to a specific set of points using the `frame()` modifier:

```swift
VStack {
    Text("Hello World")
    Spacer()
      .frame(height: 20)
    Text("Hello again!")
}
```

![Two text views with a Spacer limited to 20 points height using frame modifier](https://flaviocopes.com/images/swiftui-spacing/Screen_Shot_2021-13_at_12.30.51.png)
