Buttons — HIG Playground

iOS 버튼의 4가지 스타일과 3가지 크기를 직접 체험해보세요. 컨트롤 패널에서 속성을 변경하면 iPhone 화면에 즉시 반영됩니다.

9:41

●●●● WiFi 🔋

Buttons

Primary Action

Actions

Destructive

Compact

Disabled

⚠️ HIG 위반: 이 패턴은 권장되지 않습니다

📚 HIG Guidelines — 직접 체험하기

✓ Do — 올바른 예시

✗ Don't — 나쁜 예시

✓ 이렇게 하세요

Filled 스타일을 주요 액션에 사용
짧은 동사로 라벨 작성 ("Save", "Continue")
버튼 텍스트는 1~2 단어로 제한
계층 구조에 맞는 스타일 사용 (Filled → Tinted → Plain)
시스템 제공 버튼 스타일 사용

✗ 이렇게 하지 마세요

❌ Filled 버튼을 나란히 여러 개 배치하지 마세요
❌ 지나치게 긴 버튼 라벨은 피하세요
❌ 비파괴 액션에 destructive 스타일을 쓰지 마세요
❌ 모든 버튼을 같은 강조도로 만들지 마세요

👆 iPhone 미리보기에서 나쁜 패턴을 직접 확인해보세요

iOS provides four button styles: Filled (borderedProminent) for primary actions, Tinted (bordered with tint) for secondary actions, Bordered for tertiary actions, and Plain (borderless) for minimal emphasis.

Apple HIG: Buttons →

⚙️ Controls

Style

Filled

Tinted

Bordered

Plain

Size

Small

Regular

Large

Tint Color

Show Disabled State

Destructive Mode

SwiftUI Code

Button("Continue") { // action } .buttonStyle(.borderedProminent) .controlSize(.regular)