border-blue: Tailwind CSS Border Color class
The border-blue-* classes add a blue border of various shades.
Border-blue
The border-blue-*
classes add a blue border of various shades.
Example Code
html
<div class="grid grid-cols-4 p-2 space-y-2 rounded-t-md"> <div class="text-gray-500 border-2 rounded-md border-blue-50 text-center w-24 p-4 font-bold"> border-blue-50</div> <div class=" text-gray-500 border-2 rounded-md border-blue-100 text-center w-24 p-4 font-bold"> border-blue-100</div><div class=" text-gray-500 border-2 rounded-md border-blue-200 text-center w-24 p-4 font-bold"> border-blue-200</div><div class=" text-gray-500 border-2 rounded-md border-blue-300 text-center w-24 p-4 font-bold"> border-blue-300</div><div class=" text-gray-500 border-2 rounded-md border-blue-400 text-center w-24 p-4 font-bold"> border-blue-400</div><div class=" text-gray-500 border-2 rounded-md border-blue-500 text-center w-24 p-4 font-bold"> border-blue-500</div><div class=" text-gray-500 border-2 rounded-md border-blue-600 text-center w-24 p-4 font-bold"> border-blue-600</div><div class=" text-gray-500 border-2 rounded-md border-blue-700 text-center w-24 p-4 font-bold"> border-blue-700</div><div class=" text-gray-500 border-2 rounded-md border-blue-800 text-center w-24 p-4 font-bold"> border-blue-800</div><div class=" text-gray-500 border-2 rounded-md border-blue-900 text-center w-24 p-4 font-bold"> border-blue-900</div><div class="text-gray-500 border border-blue-950 p-4 rounded-md text-center w-24 font-bold"> bg-blue-950</div></div>
Preview
border-blue-50
border-blue-100
border-blue-200
border-blue-300
border-blue-400
border-blue-500
border-blue-600
border-blue-700
border-blue-800
border-blue-900
bg-blue-950
Windframe is a drag and drop builder for rapidly building tailwind css websites and UIs
Start building stunning tailwind UIs!
