Colors

Base
Preview Name Examples
transparent 		Transparent 
<div class="bg-transparent"></div>
<div class="text-base-transparent"></div>
currentColor 		Current 
<div class="bg-current"></div>
<div class="text-base-current"></div>
inherit 		Inherit 
<div class="bg-inherit"></div>
<div class="text-base-inherit"></div>
#ffffff 		White 
<div class="bg-white"></div>
<div class="text-base-white"></div>
#000000 		Black 
<div class="bg-black"></div>
<div class="text-base-black"></div>
Blue
Preview Name Examples
#e2f2fa 		Blue 100 
<div class="bg-blue-100"></div>
<div class="text-blue-100"></div>
#c4e5f4 		Blue 300 
<div class="bg-blue-300"></div>
<div class="text-blue-300"></div>
#009fe3 		Blue 500 
<div class="bg-blue-500"></div>
<div class="text-blue-500"></div>
#07074c 		Blue 800 
<div class="bg-blue-800"></div>
<div class="text-blue-800"></div>
Red
Preview Name Examples
#f9e7e7 		Red 100 
<div class="bg-red-100"></div>
<div class="text-red-100"></div>
#c60f0f 		Red 500 
<div class="bg-red-500"></div>
<div class="text-red-500"></div>
#9a0000 		Red 700 
<div class="bg-red-700"></div>
<div class="text-red-700"></div>
Grey
Preview Name Examples
#e4e9e9 		Grey 100 
<div class="bg-grey-100"></div>
<div class="text-grey-100"></div>
#aab2b5 		Grey 300 
<div class="bg-grey-300"></div>
<div class="text-grey-300"></div>
#4a585b 		Grey 500 
<div class="bg-grey-500"></div>
<div class="text-grey-500"></div>
#000000 		Grey 900 
<div class="bg-grey-900"></div>
<div class="text-grey-900"></div>
Validation
Preview Name Examples
#c60f0f 		Validation error 
<div class="bg-validation-error"></div>
<div class="text-validation-error"></div>
#fbeeee 		Validation error-bg 
<div class="bg-validation-error-bg"></div>
<div class="text-validation-error-bg"></div>
#1bb934 		Validation success 
<div class="bg-validation-success"></div>
<div class="text-validation-success"></div>