Default picker behavior
Dawn theme renders each option as a button group by default. Older themes (Debut) use dropdowns. Both use the same underlying {% for option in product.options_with_values %} Liquid loop.
Buttons vs dropdown
Buttons: better for 2-6 values (S/M/L/XL). Dropdown: better for 10+ values (shoe sizes 5-13 in half-sizes = 17 values).
Color swatches
Dawn supports swatch metafield on the variant. Each color value shows the actual color chip. Visual scan beats text list.
Sold-out state
Best UX: show sold-out variants as strikethrough (customer knows the color exists but is unavailable) rather than hiding entirely.
Frequently asked questions
How to change variant picker from dropdown to buttons?
Dawn theme: already buttons by default. Older themes: edit product-form.liquid, replace <select> with <fieldset> of radio buttons.
Best variant picker for size selection?
Buttons for 2-6 sizes. Dropdown for shoe sizes (long list).
How to add color swatches to variant picker?
Add a metafield 'Color swatch' to variants. Dawn renders it as color chip automatically. Older themes need code.
Should sold-out variants be hidden or disabled?
Disabled with strikethrough. Hiding confuses customers who expect a color to exist.
Can I customize variant picker without an app?
Yes via theme code. Or use Shopify Theme Editor customization for supported theme sections.
Does variant picker affect conversion?
Yes. Better picker (swatches vs dropdown) drives 5-15% conversion lift on visual products.
Is variant picker mobile-friendly?
Depends on theme. Dawn is. Older themes may render tiny targets — verify on real mobile.
How to add variant picker to custom section?
Use product-form block or replicate the Liquid loop in your custom section.
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