Line Item Properties not being added (Express Theme)

[Stutwoby]

Hello,

I'm trying to create a few inputs to add line item properties to an item so it can then be added to the cart. Currently, I'm simply trying to add a simple text input for Color, my current code:

<p class="line-item-property__field">
   <label for="lw-color">Color</label>
   <input id="lw-color" type="text" name="properties[Color]">
</p>

Copy

 
My understanding is this should be picked up at the point the add to cart button is clicked, I considered the form might be causing issues but I'm unsure.

Form code:

{%- form 'product', product, class: form_class, novalidate: 'novalidate', data-product-form: '', data-product-id: product.id, data-product-handle: product.handle, data-variant-name: variant_name -%}

Copy

What I've tried:
I considered that the properties are being added but the code to view them doesn't work. I tested this by printing out every property, but nothing is being output. I used Shopify template code to do this.

There was some information around ajax being to blame, but I couldn't identify anywhere ajax is being used to add an item to the cart.

I suspect there's some misunderstanding on my part. Any help would be much appreciated! 

As far as I can tell from these pages, the above should work:
https://ui-elements-generator.myshopify.com/pages/line-item-property
https://shopify.dev/docs/themes/liquid/reference/objects/line_item