border-slate: Tailwind CSS Border Color class
The rounded class applies small rounded corners to an element.
Border-slate
The border-slate-* classes apply a slate border of varying intensity on an element.
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-slate-50 text-center w-24 p-4 font-bold"> border-slate-50</div> <div class=" text-gray-500 border-2 rounded-md border-slate-100 text-center w-24 p-4 font-bold"> border-slate-100</div><div class=" text-gray-500 border-2 rounded-md border-slate-200 text-center w-24 p-4 font-bold"> border-slate-200</div><div class=" text-gray-500 border-2 rounded-md border-slate-300 text-center w-24 p-4 font-bold"> border-slate-300</div><div class=" text-gray-500 border-2 rounded-md border-slate-400 text-center w-24 p-4 font-bold"> border-slate-400</div><div class=" text-gray-500 border-2 rounded-md border-slate-500 text-center w-24 p-4 font-bold"> border-slate-500</div><div class=" text-gray-500 border-2 rounded-md border-slate-600 text-center w-24 p-4 font-bold"> border-slate-600</div><div class=" text-gray-500 border-2 rounded-md border-slate-700 text-center w-24 p-4 font-bold"> border-slate-700</div><div class=" text-gray-500 border-2 rounded-md border-slate-800 text-center w-24 p-4 font-bold"> border-slate-800</div><div class=" text-gray-500 border-2 rounded-md border-slate-900 text-center w-24 p-4 font-bold"> border-slate-900</div><div class="text-gray-500 border border-slate-950 p-4 rounded-md text-center w-24 font-bold"> bg-slate-950</div></div>Preview
border-slate-50
border-slate-100
border-slate-200
border-slate-300
border-slate-400
border-slate-500
border-slate-600
border-slate-700
border-slate-800
border-slate-900
bg-slate-950
Windframe is a drag and drop builder for rapidly building tailwind css websites and UIs
Start building stunning tailwind UIs!
