Colors

<div class="bg-transparent"></div>
<div class="text-base-transparent"></div>

<div class="bg-current"></div>
<div class="text-base-current"></div>

<div class="bg-inherit"></div>
<div class="text-base-inherit"></div>

<div class="bg-black"></div>
<div class="text-base-black"></div>

<div class="bg-white"></div>
<div class="text-base-white"></div>

<div class="bg-blue-100"></div>
<div class="text-blue-100"></div>

<div class="bg-blue-200"></div>
<div class="text-blue-200"></div>

<div class="bg-blue-500"></div>
<div class="text-blue-500"></div>

<div class="bg-blue-900"></div>
<div class="text-blue-900"></div>

<div class="bg-green-100"></div>
<div class="text-green-100"></div>

<div class="bg-green-200"></div>
<div class="text-green-200"></div>

<div class="bg-green-500"></div>
<div class="text-green-500"></div>

<div class="bg-green-700"></div>
<div class="text-green-700"></div>

<div class="bg-grey-100"></div>
<div class="text-grey-100"></div>

<div class="bg-grey-200"></div>
<div class="text-grey-200"></div>

<div class="bg-grey-400"></div>
<div class="text-grey-400"></div>

<div class="bg-grey-700"></div>
<div class="text-grey-700"></div>

<div class="bg-grey-800"></div>
<div class="text-grey-800"></div>

<div class="bg-red-500"></div>
<div class="text-red-500"></div>

<div class="bg-red-600"></div>
<div class="text-red-600"></div>

<div class="bg-yellow-100"></div>
<div class="text-yellow-100"></div>

<div class="bg-yellow-500"></div>
<div class="text-yellow-500"></div>

<div class="bg-pink-500"></div>
<div class="text-pink-500"></div>

<div class="bg-orange-500"></div>
<div class="text-orange-500"></div>

<div class="bg-legenda-default-10"></div>
<div class="text-legenda-default-10"></div>

<div class="bg-legenda-default-20"></div>
<div class="text-legenda-default-20"></div>

<div class="bg-legenda-default-30"></div>
<div class="text-legenda-default-30"></div>

<div class="bg-legenda-default-40"></div>
<div class="text-legenda-default-40"></div>

<div class="bg-legenda-default-50"></div>
<div class="text-legenda-default-50"></div>

<div class="bg-legenda-default-60"></div>
<div class="text-legenda-default-60"></div>

<div class="bg-legenda-default-70"></div>
<div class="text-legenda-default-70"></div>

<div class="bg-legenda-default-80"></div>
<div class="text-legenda-default-80"></div>

<div class="bg-legenda-default-90"></div>
<div class="text-legenda-default-90"></div>

<div class="bg-legenda-default-100"></div>
<div class="text-legenda-default-100"></div>

<div class="bg-legenda-default-110"></div>
<div class="text-legenda-default-110"></div>

<div class="bg-legenda-default-120"></div>
<div class="text-legenda-default-120"></div>

<div class="bg-legenda-risk-10"></div>
<div class="text-legenda-risk-10"></div>

<div class="bg-legenda-risk-20"></div>
<div class="text-legenda-risk-20"></div>

<div class="bg-legenda-risk-30"></div>
<div class="text-legenda-risk-30"></div>

<div class="bg-legenda-risk-40"></div>
<div class="text-legenda-risk-40"></div>

<div class="bg-legenda-risk-50"></div>
<div class="text-legenda-risk-50"></div>

<div class="bg-legenda-blue-10"></div>
<div class="text-legenda-blue-10"></div>

<div class="bg-legenda-blue-20"></div>
<div class="text-legenda-blue-20"></div>

<div class="bg-legenda-blue-30"></div>
<div class="text-legenda-blue-30"></div>

<div class="bg-legenda-blue-40"></div>
<div class="text-legenda-blue-40"></div>

<div class="bg-legenda-blue-50"></div>
<div class="text-legenda-blue-50"></div>

<div class="bg-legenda-blue-60"></div>
<div class="text-legenda-blue-60"></div>

<div class="bg-legenda-blue-70"></div>
<div class="text-legenda-blue-70"></div>

<div class="bg-legenda-blue-80"></div>
<div class="text-legenda-blue-80"></div>

<div class="bg-legenda-blue-90"></div>
<div class="text-legenda-blue-90"></div>

<div class="bg-legenda-blue-100"></div>
<div class="text-legenda-blue-100"></div>