bg-red :Tailwind CSS Background Color class
The bg-red classes provide a range of red shades from bg-red-50 to bg-red-950.
bg-red (Red Background Shades)
The bg-red classes provide a range of red shades from bg-red-50 to bg-red-950.
Example Code
html
<div class="flex flex-col items-center space-y-5 p-8 rounded-t-md"> <div class="bg-red-50 text-gray-500 border p-4 rounded-md text-center w-80 font-bold"> bg-red-50</div><div class="bg-red-100 text-gray-500 border p-4 rounded-md text-center w-80 font-bold"> bg-red-100</div><div class="bg-red-200 text-gray-500 border p-4 rounded-md text-center w-80 font-bold"> bg-red-200</div><div class="bg-red-300 text-gray-500 border p-4 rounded-md text-center w-80 font-bold"> bg-red-300</div><div class="bg-red-400 text-white border p-4 rounded-md text-center w-80 font-bold"> bg-red-400</div> <div class="bg-red-500 text-white p-4 rounded-md text-center w-80 font-bold"> bg-red-500</div><div class="bg-red-600 text-white border p-4 rounded-md text-center w-80 font-bold"> bg-red-600</div><div class="bg-red-700 text-white border p-4 rounded-md text-center w-80 font-bold"> bg-red-700</div><div class="bg-red-800 text-white border p-4 rounded-md text-center w-80 font-bold"> bg-red-800</div><div class="bg-red-900 text-white border p-4 rounded-md text-center w-80 font-bold"> bg-red-900</div><div class="bg-red-950 text-white border p-4 rounded-md text-center w-80 font-bold"> bg-red-950</div></div>
Preview
bg-red-50
bg-red-100
bg-red-200
bg-red-300
bg-red-400
bg-red-500
bg-red-600
bg-red-700
bg-red-800
bg-red-900
bg-red-950
Windframe is a drag and drop builder for rapidly building tailwind css websites and UIs
Start building stunning tailwind UIs!
