Toggle navigation
☰
HTML
CSS
Scripting
Database
<!doctype html> <title>Tailwind CSS Utility-First Example</title> <script src="https://cdn.tailwindcss.com"></script> <body class="bg-gray-100 p-8 flex justify-center"> <div class="max-w-sm rounded-xl overflow-hidden shadow-2xl bg-white p-8"> <div class="flex items-center space-x-4 mb-6"> <div class="h-12 w-12 bg-blue-500 rounded-full flex items-center justify-center text-white font-bold text-xl"> T </div> <div> <h2 class="text-xl font-semibold text-gray-900 leading-tight">Tailwind CSS</h2> <p class="text-sm text-gray-500">Utility-First Framework</p> </div> </div> <p class="text-gray-600 mb-6"> Focus on your UI instead of your CSS. Rapidly build custom designs without ever leaving your HTML. </p> <button class="w-full bg-blue-600 hover:bg-blue-700 text-white font-medium py-3 px-4 rounded-lg transition-colors"> Get Started </button> </div> </body>
