Sidebars — HIG Playground

Explore iOS Sidebar structure and options interactively. Change section count, icons, and badges in the control panel to see changes reflected on the iPhone screen instantly.

9:41

●●●● WiFi 🔋

Sidebar

⚠️ HIG Violation: Improper sidebar structure

📚 HIG Guidelines — Try It Yourself

✓ Do — Good Example

✗ Don't — Bad Example

✓ Do This

Use clear section headers
Show badges for unread/pending counts
Support reordering in edit mode
Use SF Symbols consistently

✗ Don't Do This

Don't nest sidebars too deeply
Don't use badges for non-essential info
Don't make sidebar the only navigation method
Don't hide important sections

👆 See the bad pattern in the iPhone preview above

Show Icons

Show Badges

Edit Mode

SwiftUI Code