HIG Playground Home GitHub 🇺🇸 EN
HIG Lab → HIG Playground → Steppers

Steppers

Explore iOS Stepper +/- controls interactively. Change step size, range, and label position in the control panel to see changes reflected on the iPhone screen instantly.

9:41
●●●● WiFi 🔋
Steppers
Current Value
5
Range: 0 – 10
Quantity
Quantity
Step: 1
Guests
Adults
2 guests
Price
Tip Amount
$5.00
⚠️ HIG Violation: Stepper is hard to use
📚 HIG Guidelines — Try It Yourself
✓ Do — Good Example
✗ Don't — Bad Example

✓ Do This

  • Display the current value clearly near the stepper
  • Set appropriate min/max range limits
  • Use logical step increments (1, 5, 10, etc.)
  • Disable +/- buttons at range boundaries
  • Place the label to the leading side by default

✗ Don't Do This

  • Don't use a stepper for large range selections
  • Don't hide the current value from the user
  • Don't use inconsistent step sizes without reason
  • Don't make the stepper too small to tap

👆 See the bad pattern in the iPhone preview above

0 – 10
0 – 50
0 – 100
-10 – 10
Leading
Trailing
Top
SwiftUI Code
HIG Lab — Apple Human Interface Guidelines Interactive Playground