<div>
<!--<span style="float:left;">-->
<span style="display: inline-block">
<div class="uig-color uig-color--blue-8">
<div class="uig-color__example"></div>
<p class="uig-color__text">80%</p>
</div><br>
<div class="uig-color uig-color--blue-6">
<div class="uig-color__example"></div>
<p class="uig-color__text">60%</p>
</div><br>
<div class="uig-color uig-color--blue-4">
<div class="uig-color__example"></div>
<p class="uig-color__text">40%</p>
</div><br>
<div class="uig-color uig-color--blue-2">
<div class="uig-color__example"></div>
<p class="uig-color__text">20%</p>
</div><br>
</span>
<!--<span style="float:left;">-->
<span style="display: inline-block">
<div class="uig-color uig-color--black-8">
<div class="uig-color__example"></div>
<p class="uig-color__text">80%</p>
</div><br>
<div class="uig-color uig-color--black-6">
<div class="uig-color__example"></div>
<p class="uig-color__text">60%</p>
</div><br>
<div class="uig-color uig-color--black-4">
<div class="uig-color__example"></div>
<p class="uig-color__text">40%</p>
</div><br>
<div class="uig-color uig-color--black-2">
<div class="uig-color__example"></div>
<p class="uig-color__text">20%</p>
</div><br>
</span>
<!--<span style="float:left;">-->
<span style="display: inline-block">
<div class="uig-color uig-color--green-8">
<div class="uig-color__example"></div>
<p class="uig-color__text">80%</p>
</div><br>
<div class="uig-color uig-color--green-6">
<div class="uig-color__example"></div>
<p class="uig-color__text">60%</p>
</div><br>
<div class="uig-color uig-color--green-4">
<div class="uig-color__example"></div>
<p class="uig-color__text">40%</p>
</div><br>
<div class="uig-color uig-color--green-2">
<div class="uig-color__example"></div>
<p class="uig-color__text">20%</p>
</div><br>
</span>
<!--<span style="float:left;">-->
<span style="display: inline-block">
<div class="uig-color uig-color--red-8">
<div class="uig-color__example"></div>
<p class="uig-color__text">80%</p>
</div><br>
<div class="uig-color uig-color--red-6">
<div class="uig-color__example"></div>
<p class="uig-color__text">60%</p>
</div><br>
<div class="uig-color uig-color--red-4">
<div class="uig-color__example"></div>
<p class="uig-color__text">40%</p>
</div><br>
<div class="uig-color uig-color--red-2">
<div class="uig-color__example"></div>
<p class="uig-color__text">20%</p>
</div><br>
</span>
<!--<span style="float:left;">-->
<span style="display: inline-block">
<div class="uig-color uig-color--yellow-8">
<div class="uig-color__example"></div>
<p class="uig-color__text">80%</p>
</div><br>
<div class="uig-color uig-color--yellow-6">
<div class="uig-color__example"></div>
<p class="uig-color__text">60%</p>
</div><br>
<div class="uig-color uig-color--yellow-4">
<div class="uig-color__example"></div>
<p class="uig-color__text">40%</p>
</div><br>
<div class="uig-color uig-color--yellow-2">
<div class="uig-color__example"></div>
<p class="uig-color__text">20%</p>
</div><br>
</span>
</div>
{
"colors": [
{
"blue-8": "80%",
"blue-6": "60%",
"blue-4": "40%",
"blue-2": "20%"
},
{
"black-8": "80%",
"black-6": "60%",
"black-4": "40%",
"black-2": "20%"
},
{
"green-8": "80%",
"green-6": "60%",
"green-4": "40%",
"green-2": "20%"
},
{
"red-8": "80%",
"red-6": "60%",
"red-4": "40%",
"red-2": "20%"
},
{
"yellow-8": "80%",
"yellow-6": "60%",
"yellow-4": "40%",
"yellow-2": "20%"
}
]
}