Tailwind Demo
Tailwind Code
Output
<!DOCTYPE html> <html> <head> <script src="https://cdn.tailwindcss.com"></script> </head> <body> <h1 class="text-red-700 text-xl mx-20 font-bold "> Tailwind bg color - Paragraph </h1> <div class="flex flex-5 mx-8 mt-10 justify-between gap-2"> <div class="max-w-xs w-96"> <p class="mb-5 h-10 w-40 bg-red-400 text-orange-100 text-center">bg-red-400</p> <p class="mb-5 h-10 w-60 bg-orange-500 text-orange-100 text-center">bg-orange-500</p> <p class="mb-5 h-10 w-[16rem] bg-amber-800 text-white text-center">bg-amber-800</p> <p class="mb-5 h-10 w-90 bg-green-500 text-orange-100 text-center">bg-green-500</p> <p class="mb-5 h-10 w-[27rem] bg-teal-300 text-black-100 text-center">bg-teal-300</p> </div> </body> </html>
Tailwind bg color - Paragraph
bg-red-400
bg-orange-500
bg-amber-800
bg-green-500
bg-teal-300