Using a template include multiple times within the same template

I want to add a drop down that will allow my client to select a colour scheme. Without going into too much detail they can basically select two colours (bg colours of image overlays) To achieve this I thought I could use one colour_picker template include.

I'm doing the following:

<perch:repeater id="tab_content" label="Tab Content">
    <!--Allow user to select color for each block-->
    <perch:template id="select_colour_primary" path="content/template-includes/colour_picker.html" />
    <div class="image-content-wrapper primary">
        <perch:if id="select_colour_top" value="blue">
            <div class="image-overlay blue-o">
        </perch:if>

               <perch:if id="select_colour_top" value="green">
            <div class="image-overlay green-o">
        </perch:if>
       </div>
      <perch:template id="select_colour_secondary" path="content/template-includes/colour_picker.html" />
       <div class="image-content-wrapper secondary">
        <perch:if id="select_colour_secondary" value="blue">
            <div class="image-overlay blue-o">
        </perch:if>

               <perch:if id="select_colour_secondary" value="green">
            <div class="image-overlay green-o">
        </perch:if>
       </div>

Obviously this is only a snippet of the template but hopefully you can see what I'm trying to do. I was hoping that I could apply a new ID to the template include (colour_picker.html) so that I can then reference it in my if conditionals. However, it looks like it only takes the ID that is originally set in the template include which means it doesn't pick up the value. Am I doing this wrong, is there another way or is this beyond the scope of template includes?