lightswind
Version:
A modern frontend library with pre-built Tailwind CSS components for building responsive and interactive user interfaces.
47 lines (39 loc) • 2.38 kB
HTML
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>@codewith_muhilan</title>
<script src="https://cdn.tailwindcss.com"></script>
<script defer src="https://cdn.jsdelivr.net/npm/alpinejs@3.x.x/dist/cdn.min.js"></script>
<!-- Lightwind CDN -->
<link rel="stylesheet" href="https://lightswind.com/lightswind.css">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/lightwind@1.9.0/src/lightswind.css">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/lightwind@1.7.0/src/tailwind.min.css">
</head>
<body class="">
<div class="absolute top-1/2 left-1/2 transform -translate-x-1/2 -translate-y-1/2 w-full max-w-2xl ">
<div class="relative text-center flex items-center justify-center flex-wrap gap-4">
<a href="javascript:void(0)"
class='inline-flex gap-2 items-center justify-center font-bold bg-primarylw text-white hover:bg-primarylw-2 p-4 px-10 rounded-full cursor-pointer'>
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5"
stroke="currentColor" class="size-6">
<path stroke-linecap="round" stroke-linejoin="round"
d="M9 9V4.5M9 9H4.5M9 9 3.75 3.75M9 15v4.5M9 15H4.5M9 15l-5.25 5.25M15 9h4.5M15 9V4.5M15 9l5.25-5.25M15 15h4.5M15 15v4.5m0-4.5 5.25 5.25" />
</svg>
Button
</a>
<a href="javascript:void(0)"
class='inline-flex gap-2 gap-2 items-center justify-center font-bold bg-darklw text-white hover:bg-darklw-2 p-4 px-10 rounded-full cursor-pointer'>
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5"
stroke="currentColor" class="size-6">
<path stroke-linecap="round" stroke-linejoin="round"
d="M9 9V4.5M9 9H4.5M9 9 3.75 3.75M9 15v4.5M9 15H4.5M9 15l-5.25 5.25M15 9h4.5M15 9V4.5M15 9l5.25-5.25M15 15h4.5M15 15v4.5m0-4.5 5.25 5.25" />
</svg>
Button
</a>
</div>
</div>
<script src="https://cdn.jsdelivr.net/npm/lightwind@1.9.0/src/lightswind.js"></script>
</body>
</html>