Searchable dropdown
Type-ahead search filters options as customer types. Handles 100+ values without scroll fatigue. Select2, Choices.js libraries.
Categorized grouping
Group by category: 'Red shades' → 5 reds, 'Blue shades' → 8 blues. Optgroup HTML element or app-based.
Two-step selection
Step 1: pick category (Red/Blue/Green). Step 2: pick specific value. Reduces list size at each step.
Autocomplete
Text input with autocomplete suggestions. Customer types 'Cri' → suggests 'Crimson, Cricket Green'. Fastest for known values.
Frequently asked questions
How many options is too many in one dropdown?
20+ starts feeling long. 50+ needs search. 100+ needs categorization or two-step.
How to add searchable dropdown to Shopify?
App-based (Print It My Way, Bold) or JS library (Select2, Choices.js).
How to categorize long option list?
HTML optgroup element for simple grouping. App-based for advanced grouping (with icons, previews).
Two-step vs searchable dropdown?
Searchable if customer knows the value. Two-step if browsing.
Does long option list affect page speed?
Minimal for text. Image-heavy long lists (100 swatches) need lazy-load.
Should I have 100 color options?
Only if all 100 have real demand. Consolidate similar shades into fewer options.
Best app for long option lists?
Print It My Way, Fancy Product Designer, Bold Product Options. All support advanced grouping.
Mobile UX for 100+ options?
Bottom sheet with search bar at top. Categorized list below. Native OS wheel picker as fallback.
Related reading
Try it free on Shopify
Print It My Way's permanent Free plan includes live preview, custom options, and Cart Transform pricing.
Install Print It My Way