How can I modify the variant picker buttons and size text on my product page?

Store Design
, , , , , , , , , , , , , ,

Topic summary

A user wants to modify variant picker buttons on their product page: making them rectangular (removing rounded corners) and making the ‘SIZE’ label text bigger and bold.

Solution provided:

  • Add CSS code to base.css file:
    • font-weight: 600 for the form label to make it bold
    • border-radius: 0 !important to make buttons rectangular

Additional requests addressed:

  • Another user asked how to remove the “Select Size” text entirely, solved by adding display: none CSS to the form label
  • A third user inquired about keeping color swatches as colors instead of text labels, but resolved it independently

Status: Original issue resolved successfully. The CSS modifications are applied through the theme’s code editor (Online Store → Theme → Edit code).

Summarized with AI on November 1. AI used: claude-sonnet-4-5-20250929.
10

No nvm, I fixed it.
Thank you !