Brand
Purple
#AE4C90
Light Purple
#C584B1
Dark Purple
#8B3C73
Blue
#66CAE1
Light Blue
#97DAE9
Dark Blue
#3BBBD9
<% for(var i=0; i < colours.length; i++) { %>
<div class="aigis-colorpalette">
<div class="aigis-colorpalette__swatches" style="background-color: #<%= colours[i][1] %>;"><% if (colours[i][2]) { %>
<div class="aigis-colorpalette__swatches--small aigis-colorpalette__swatches--left" style="background-color: #<%= colours[i][2] %>;"></div><% } %><% if (colours[i][3]) { %>
<div class="aigis-colorpalette__swatches--small aigis-colorpalette__swatches--right" style="background-color: #<%= colours[i][3] %>;"></div><% } %>
</div>
<div class="aigis-colorpalette__label">
<div>
<span><%= colours[i][0] %></span>
<span>#<%= colours[i][1] %></span>
</div><% if (colours[i][2]) { %>
<div>
<span>Light <%= colours[i][0] %></span>
<span>#<%= colours[i][2] %></span>
</div><% } %><% if (colours[i][3]) { %>
<div>
<span>Dark <%= colours[i][0] %></span>
<span>#<%= colours[i][3] %></span>
</div><% } %>
</div>
</div><% } %>
Social Colours
<% for(var i=0; i < colours.length; i++) { %>
<div class="aigis-colorpalette">
<div class="aigis-colorpalette__swatches" style="background-color: #<%= colours[i][1] %>;"><% if (colours[i][2]) { %>
<div class="aigis-colorpalette__swatches--small aigis-colorpalette__swatches--left" style="background-color: #<%= colours[i][2] %>;"></div><% } %><% if (colours[i][3]) { %>
<div class="aigis-colorpalette__swatches--small aigis-colorpalette__swatches--right" style="background-color: #<%= colours[i][3] %>;"></div><% } %>
</div>
<div class="aigis-colorpalette__label">
<div>
<span><%= colours[i][0] %></span>
<span>#<%= colours[i][1] %></span>
</div><% if (colours[i][2]) { %>
<div>
<span>Light <%= colours[i][0] %></span>
<span>#<%= colours[i][2] %></span>
</div><% } %><% if (colours[i][3]) { %>
<div>
<span>Dark <%= colours[i][0] %></span>
<span>#<%= colours[i][3] %></span>
</div><% } %>
</div>
</div><% } %>
