Radio buttons displayed incorrectly

Topic summary

Main issue: Variant options (“radio buttons”) display inconsistently in a Shopify Dawn theme. They appear as simple radios in a featured product section on the collection page, but as styled “variant pills” elsewhere.

Context: Store link provided to the collection page (…/collections/produkte). Goal is to have pill-style variant selectors consistently, matching the second screenshot.

Evidence: Two screenshots illustrate current vs desired styles; visuals are central to understanding the discrepancy. No code snippets were shared.

Discussion: A responder noted that variant pills already appear (likely on the product page), referencing a screenshot. The original poster clarified the problem persists specifically on the “All products” (collection) page at the bottom.

Open questions: What CSS or template differences cause the collection section to render radios instead of pills? Whether the featured product block on the collection page needs additional classes or theme settings.

Status: No fix provided yet. The poster is requesting guidance on the necessary CSS/HTML or theme setting changes to achieve consistent pill styling on the collection page.

Summarized with AI on December 27. AI used: gpt-5.

Hi there,

I don’t know why the radio buttons in the featured product section I just added are displayed differently than on the rest of my page (https://taneraskin.com/collections/produkte). Using Dawn theme.

I looks like this:

And I want it to look like this (goal):

What change to I have to make? Do you see an error in my code or a change I’ve made?

Best regards,

Isabelle

Hello @isabellemaria , You already have variant pills as per your 2nd screenshot. Check the screenshot below.

Yes, but NOT for the all products page at the bottom here: https://taneraskin.com/collections/produkte

Do you know a solution for this?