Tailwind AI
AI-powered Tailwind CSS
Tailwind AI
Generate
Pricing
Discord
Discord
New
Changelog
Public Components
Browse Components
Toggle Sidebar
Krisz221
User profile
Free user
Krisz221
mkriszmasters@gmail.com
6
Components
0
Remixes
0
Likes
mkriszmasters@gmail.com
about 1 month ago
2 days ago
Latest activity
Untitled Component
Created a component
about 1 month ago
Untitled Component
Created a component
about 1 month ago
Untitled Component
Created a component
about 1 month ago
Untitled Component
Created a component
about 1 month ago
Untitled Component
Created a component
about 1 month ago
Latest components
Krisz221
about 1 month ago
do just a respawn in 10 seconds text on the center and not the center of the screen make it downer
HTML5
html
Krisz221
about 1 month ago
do an card left center that types a name a pfp a banner and some lorem ipsum and no background for the card have an gray background
HTML5
html
Krisz221
about 1 month ago
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Leaderboard</title> <script src="https://cdn.tailwindcss.com"></script> </head> <body class="bg-gray-900 text-white flex items-center justify-center min-h-screen select-none"> <div class="w-full max-w-4xl p-4"> <table class="w-full text-center border-separate border-spacing-y-2"> <thead> <tr class="bg-[#000000A6] text-gray-300 border border-pink-700"> <th>#</th> <th>Name</th> <th>Kills</th> <th>Deaths</th> <th>K/D</th> </tr> </thead> <tbody> <tr class="bg-yellow-500 text-black border border-pink-700 rounded-lg"> <td class="px-4 py-2">1</td> <td class="px-4 py-2">smokyrp1</td> <td class="px-4 py-2">42060</td> <td class="px-4 py-2">26463</td> <td class="px-4 py-2">1.59</td> </tr> <tr class="bg-gray-400 text-black border border-pink-700 rounded-lg"> <td class="px-4 py-2">2</td> <td class="px-4 py-2">nabil.exe7</td> <td class="px-4 py-2">40084</td> <td class="px-4 py-2">22922</td> <td class="px-4 py-2">1.75</td> </tr> <tr class="bg-orange-500 text-black border border-pink-700 rounded-lg"> <td class="px-4 py-2">3</td> <td class="px-4 py-2">securitywarr</td> <td class="px-4 py-2">28870</td> <td class="px-4 py-2">14378</td> <td class="px-4 py-2">2.01</td> </tr> <tr class="bg-[#000000A6] border border-pink-700 rounded-lg"> <td class="px-4 py-2">4</td> <td class="px-4 py-2">neeeeeef_0</td> <td class="px-4 py-2">24449</td> <td class="px-4 py-2">18090</td> <td class="px-4 py-2">1.35</td> </tr> <tr class="bg-[#000000A6] border border-pink-700 rounded-lg"> <td class="px-4 py-2">5</td> <td class="px-4 py-2">_red5m.</td> <td class="px-4 py-2">24200</td> <td class="px-4 py-2">25009</td> <td class="px-4 py-2">0.97</td> </tr> <tr class="bg-purple-700 text-white border border-pink-700 rounded-lg"> <td class="px-4 py-2">26689</td> <td class="px-4 py-2">2ms69</td> <td class="px-4 py-2">0</td> <td class="px-4 py-2">1</td> <td class="px-4 py-2">0.00</td> </tr> </tbody> </table> <p class="text-gray-400 text-center mt-4">Use ← → to switch pages (1/2865)</p> </div> </body> </html> why are the borders are not showing
HTML5
html
Krisz221
about 1 month ago
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Leaderboard</title> <script src="https://cdn.tailwindcss.com"></script> </head> <body class="bg-gray-900 text-white flex items-center justify-center min-h-screen"> <div class="w-full max-w-4xl p-4"> <table class="w-full border-separate border-spacing-y-2 text-center"> <thead> <tr class="bg-gray-800 text-gray-300"> <th>#</th> <th>Name</th> <th>Kills</th> <th>Deaths</th> <th>K/D</th> </tr> </thead> <tbody> <tr class="bg-yellow-500 text-black font-bold"> <td class="px-4 py-2">1</td> <td class="px-4 py-2">smokyrp1</td> <td class="px-4 py-2">42060</td> <td class="px-4 py-2">26463</td> <td class="px-4 py-2">1.59</td> </tr> <tr class="bg-gray-300 text-black font-bold"> <td class="px-4 py-2">2</td> <td class="px-4 py-2">nabil.exe7</td> <td class="px-4 py-2">40084</td> <td class="px-4 py-2">22922</td> <td class="px-4 py-2">1.75</td> </tr> <tr class="bg-orange-500 text-black font-bold"> <td class="px-4 py-2">3</td> <td class="px-4 py-2">securitywarr</td> <td class="px-4 py-2">28870</td> <td class="px-4 py-2">14378</td> <td class="px-4 py-2">2.01</td> </tr> <tr class="bg-gray-800"> <td class="px-4 py-2">4</td> <td class="px-4 py-2">neeeeeef_0</td> <td class="px-4 py-2">24449</td> <td class="px-4 py-2">18090</td> <td class="px-4 py-2">1.35</td> </tr> <tr class="bg-gray-800"> <td class="px-4 py-2">5</td> <td class="px-4 py-2">_red5m.</td> <td class="px-4 py-2">24200</td> <td class="px-4 py-2">25009</td> <td class="px-4 py-2">0.97</td> </tr> <tr class="bg-purple-700 text-white font-bold"> <td class="px-4 py-2">26689</td> <td class="px-4 py-2">2ms69</td> <td class="px-4 py-2">0</td> <td class="px-4 py-2">1</td> <td class="px-4 py-2">0.00</td> </tr> </tbody> </table> <p class="text-gray-400 text-center mt-4">Use ← → to switch pages (1/2865)</p> </div> </body> </html> how can i add to the tables an border
HTML5
html
Krisz221
about 1 month ago
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Void Academy - HUD</title> <script src="https://cdn.tailwindcss.com"></script> <link rel="stylesheet" href="//code.jquery.com/ui/1.13.0/themes/base/jquery-ui.css"> <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script> <script src="https://code.jquery.com/ui/1.13.0/jquery-ui.min.js"></script> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css"> </head> <body class="h-screen select-none flex justify-center items-end relative"> <div id="hud" class="w-[20%] bg-[#141414] rounded-lg p-3 absolute bottom-4 right-4 shadow-lg"> <div class="text-center text-sm text-gray-400 mb-2"> discord.gg/<span class="text-purple-700">void</span> </div> <div id="speedo" class="text-center text-4xl font-bold text-purple-700 pb-2"> <span id="speedotext">100</span> <span class="text-gray-400 text-2xl">km/h</span> </div> <div class="relative px-2 py-2 bg-[#1e1e1e] rounded-md overflow-hidden"> <div class="flex items-center justify-between px-1 relative z-10"> <div class="flex items-center space-x-2"> <img src="https://www.tailwindai.dev/placeholder.svg" alt="Profile" class="w-8 h-8 rounded-full"> <div class="flex items-center text-gray-400"> <i class="fas fa-heart mr-1"></i> <span id="hp" class="text-sm">100%</span> </div> </div> <div class="flex items-center text-gray-400"> <i class="fas fa-user mr-1"></i> <span id="id" class="text-sm">28599</span> </div> </div> <div id="hpbar" class="absolute inset-0 bg-purple-700 opacity-50 transition-all duration-700 rounded-md"></div> </div> <div class="text-center pt-2"> <div class="flex justify-center items-center space-x-2"> <div id="mickozel" class="flex items-center bg-[#1e1e1e] px-6 py-1 rounded-md text-xs"> <i class="fas fa-microphone text-yellow-500 mr-2"></i> <span class="text-gray-400">Közel</span> </div> <div id="micnormal" class="flex items-center bg-[#1e1e1e] px-6 py-1 rounded-md text-xs"> <i class="fas fa-microphone text-green-500 mr-2"></i> <span class="text-gray-400">Normál</span> </div> <div id="mictavol" class="flex items-center bg-[#1e1e1e] px-6 py-1 rounded-md text-xs"> <i class="fas fa-microphone text-red-500 mr-2"></i> <span class="text-gray-400">Távol</span> </div> </div> </div> </div> <script src="script.js"></script> </body> </html> make this responsive
HTML5
html
