Tailwind CSS badges

<span class="bg-blue-100 text-blue-800 text-xs font-semibold mr-2 px-2.5 py-0.5 rounded dark:bg-blue-200 dark:text-blue-800">Default</span>
<span class="bg-gray-100 text-gray-800 text-xs font-semibold mr-2 px-2.5 py-0.5 rounded dark:bg-gray-700 dark:text-gray-300">Dark</span>
<span class="bg-red-100 text-red-800 text-xs font-semibold mr-2 px-2.5 py-0.5 rounded dark:bg-red-200 dark:text-red-900">Red</span>
<span class="bg-green-100 text-green-800 text-xs font-semibold mr-2 px-2.5 py-0.5 rounded dark:bg-green-200 dark:text-green-900">Green</span>
<span class="bg-yellow-100 text-yellow-800 text-xs font-semibold mr-2 px-2.5 py-0.5 rounded dark:bg-yellow-200 dark:text-yellow-900">Yellow</span>
<span class="bg-indigo-100 text-indigo-800 text-xs font-semibold mr-2 px-2.5 py-0.5 rounded dark:bg-indigo-200 dark:text-indigo-900">Indigo</span>
<span class="bg-purple-100 text-purple-800 text-xs font-semibold mr-2 px-2.5 py-0.5 rounded dark:bg-purple-200 dark:text-purple-900">Purple</span>
<span class="bg-pink-100 text-pink-800 text-xs font-semibold mr-2 px-2.5 py-0.5 rounded dark:bg-pink-200 dark:text-pink-900">Pink</span>

Source: flowbite.com

Similar codes

0 vote164 views1 answer
Best slider library
Html
2 votes186 views2 answers
Placeholder textbox wpf
Html
15 votes150 views1 answer
In select option how to make one default
Html
69 votes166 views3 answers
Js onclick redirect
Html
39 votes178 views3 answers
Autocomplete off not working in chrome
Html
0 vote160 views1 answer
How to get the 4th child of an html element
Html
0 vote175 views1 answer
Aligning image to middle in html
Html
8 votes175 views3 answers
How to add multiple classes in html
Html
0 vote151 views1 answer
Svg content_type
Html
1 vote197 views9 answers
Among us
Html