form-field-colour.html

<label 
    {% include patterns/form-field-auto-save-attributes %}
    class="
        {% include patterns/form-field-auto-save-classes %}
        {% if item.depends %}pat-depends{% endif %}" 
    {% if item.depends %}data-pat-depends="{{ item.depends }}; transition: slide"{% endif %}>
    {% include patterns/form-field-label-conditional.html %}
    <!-- <p 
        class="colour-chooser-launcher">
        <a 
            class="pat-button pat-modal executed" 
            id="{{ item.id }}" 
            data-pat-modal="class: medium panel" 
            {% unless item.value contains 'Default' %}
                style="background-color: {{ item.value | replace:' ','' | lowercase }}"         
            {% endunless %}
            href="/feedback/header-colour-chooser#document-content">{{ item.value }}</a>
    </p> -->
    <input 
        type="color" 
        list="preset-colours-{{ include.label | slugify }}">
        <datalist 
            id="preset-colours-{{ include.label | slugify }}">
            <option>Magenta</option>
            <option>Dark golden rod</option>
            <option>#0000ff</option>
        </datalist>
</label>