Lists

Explore iOS List Plain and Inset Grouped styles interactively. Change properties in the control panel to see them reflected on the iPhone screen instantly.

9:41
●●●● WiFi 🔋
Settings
General
📶
Wi-Fi
HomeNetwork
Bluetooth
On
🔔
Notifications
🔊
Sounds & Haptics
🌔
Focus
Privacy
📍
Location Services
On
📷
Camera
🌄
Photos
🎙
Microphone
⚠️ HIG Violation: Improper list structure
📚 HIG Guidelines — Try It Yourself
✓ Do — Good Example
✗ Don't — Bad Example

✓ Do This

  • Use standard 44pt minimum row height for touch targets
  • Use Inset Grouped style for settings-like interfaces
  • Use consistent disclosure indicators (chevrons) for drill-down rows
  • Align separators to the text, not the icon
  • Group related items into sections with headers

✗ Don't Do This

  • Don't mix different row heights in the same section
  • Don't use chevrons on rows that don't navigate
  • Don't overload rows with too much information
  • Don't remove separators between rows entirely

👆 See the bad pattern in the iPhone preview above

Show Section Headers
Show Icons
Show Chevrons
SwiftUI Code