Agent skill · design visual · aiskillstore

hig-components-controls

Check for .claude/apple-design-context.md before asking questions. Use existing context and only ask for information not already covered.

Why this skill is useful

Codifies best practices for selection and input controls in UI design, which the AI could infer but now has clear guidelines.

What it needs

About 3k tokens when loaded. Last updated 2026-08-07. 405 stars on the source repository.

What this skill does

Apple HIG: Selection and Input Controls Check for .claude/apple-design-context.md before asking questions. Use existing context and only ask for information not already covered. Key Principles 1. Clear current state. Users must always see what is selected. Toggles show on/off, segmented controls highlight the active segment, pickers display the current selection. 2. Prefer standard system controls. Built-in controls provide consistency and accessibility. Custom controls introduce a learning curve and may break assistive features. 3. Toggles for binary states. On or off. In Settings-style screens, changes take effect immediately. In modal forms, changes commit on confirmation. 4. Segmented controls for mutually exclusive options. 2-5 items, roughly equal importance, short labels. 5. Sliders for continuous values. When precise numeric input is not critical. Provide min/max labels or icons for range endpoints. 6. Pickers for long option lists. Too many options for a segmented control. Works well for dates, times, structured data. 7. Steppers for small, precise adjustments. Increment/decrement in fixed steps. Display current value next to the stepper with reasonable min/max bounds. 8. Text fields for short, single-line input. Text views for multi-line. Configure keyboard type to match expected input (email, URL, number). 9. Combo boxes: text input + selection list. macOS. Type a value or choose from a predefined list when custom values are valid. 10. Token fields: discrete values as visual tokens. macOS. For email recipients, tags, or collections of discrete items. 11. Gauges and rating indicators display values. Gauges show a value within a range. Rating indicators show ratings (often stars). Display-only; use interactive variants for input. …

How to use it

Reference it in AdaL, Claude Code, Cursor or any coding agent — nothing to install:

@skills aiskillstore/hig-components-controls

View the source on GitHub

Browse the @skills marketplace