# Let background content extend past the safe area

> Apple's rule is that foreground content stays inside the safe area while background artwork extends to the full bounds.

Source: https://iphoneduosupport.com/checklist/background-content-ignores-safe-area/

Severity: polish
Category: safe-area
Applies to: swiftui, uikit
Symptom: Visible bands of background colour at the edges of the inner display where artwork stops short of the corners.
Sources: https://developer.apple.com/videos/play/tech-talks/111461/
Last verified: 2026-09-09

---

Getting this wrong is what makes an app look inset and unfinished on a large display, even when nothing is functionally broken.

## The rule

Two different treatments for two different kinds of content:

```swift
// Background artwork — extend to the full bounds
BackgroundArtwork()
    .ignoresSafeArea()
```

```swift
// UIKit
backgroundView.frame = view.bounds
```

```swift
// Foreground, interactive content — stay inside the safe area
foreground.frame = view.bounds.inset(by: view.safeAreaInsets)
```

The mistake is applying one policy to a whole screen. A card with a background image should let the image bleed while keeping its text and buttons inset.

## Match the screen corners

iPhone Duo's displays are rounded, and content that runs to the edge should follow that curve. The concentricity APIs from iOS 26 do this without hard-coded radii:

```swift
ConcentricRectangle()
    .fill(Color.green)
    .padding(8.0)
    .ignoresSafeArea()
```

```swift
// UIKit
// UICornerConfiguration
```

A hard-coded corner radius is a hard-coded dimension, with the same problem as any other — it was tuned for one device and is now wrong on two more.

## How to verify

Show a full-bleed screen on both displays and look at all four corners. Artwork should reach the rounded edge and follow its curve, while text and controls stay clear of it.

---

Published by iPhone Duo Support (https://iphoneduosupport.com). Not affiliated with Apple Inc.