How can I display "SELECT SIZE" text n the variant picker?

[JordanMM]

We’d like to add the option "Select Size" within the variant picker. Currently, the smallest size is automatically selected by default. However, we want "Select Size" to be shown in the variant picker, as shown in the example below, so customers can click on it and choose their desired size.

Theme: Dawn

What we currently have:

What we want:

[Flair-Liam]

Hi Jordan,

I’ve looked through the codebase in the Dawn theme, and it doesn’t seem like there’s a straightforward solution.

In the file dawn/snippets/product-variant-picker.liquid around line 69 we can change the select button to: 

            <select
              id="Option-{{ section.id }}-{{ forloop.index0 }}"
              class="select__select"
              name="options[{{ option.name | escape }}]"
              form="{{ product_form_id }}"
            >
              <!-- Add the placeholder "Select Size" -->
              <option value="" disabled selected>Select {{ option.name }}</option>

              {% render 'product-variant-options',
                product: product,
                option: option,
                block: block,
                picker_type: picker_type
              %}
            </select>

And it would appear like this 

However, we’d also need to update the logic (and potentially some JS) around which variant is selected first. This might require some development time to ensure the variants are handled correctly without auto-selecting the first option.

An alternative would be to create an extra, non-purchasable product variant to act as the “Select Size” option, though this may affect inventory management and isn’t an ideal long-term solution.

Let me know if you need any further clarification!

Kind regards, Liam

[hyp3yourfeet]

Hello, I would like some support on creating the same for my variant picker. What code should I add to have the placeholder text “select size” included in my dropdown menu? 
Thanks in advance for your help!