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

-1 vote213 views3 answers
Vue if
Html
2 votes199 views2 answers
Javascript onclick get event
Html
2 votes194 views1 answer
Bootstrap range input
Html
92 votes250 views6 answers
Bootstrap bg colors
Html
3 votes198 views1 answer
Html input change default error message
Html
0 vote219 views1 answer
OpenGraph 1
Html
12 votes206 views3 answers
Html value attribute
Html
-3 votes191 views1 answer
How to add heading html
Html
0 vote201 views1 answer
Align table in middle of page
Html
1 vote218 views1 answer
Credit card form html
Html