All Prompts
All Prompts

buttontailwindctawalletweb3interactiveanimated
Connect Wallet Gradient Button with Aura Hover
Кнопка 'Connect Wallet' с градиентом и эффектом ауры при наведении. UI компонент для подключения кошелька в Web3 приложениях.
Prompt
<div class="group relative">
<!-- Outer Aura -->
<div class="absolute -inset-4 bg-indigo-500/20 rounded-full blur-xl group-hover:bg-indigo-500/30 transition-colors duration-500"></div>
<button class="flex gap-3 hover:shadow-[0_15px_25px_-5px_rgba(67,56,202,0.5),inset_0_1px_0_rgba(255,255,255,0.2)] active:scale-[0.98] transition-all duration-200 text-white bg-gradient-to-b from-indigo-500 to-indigo-700 rounded-full pt-4 pr-10 pb-4 pl-10 relative shadow-[0_10px_20px_-5px_rgba(67,56,202,0.4),inset_0_1px_0_rgba(255,255,255,0.2)] gap-x-3 gap-y-3 items-center">
<span class="text-base font-medium">Connect Wallet</span>
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" data-lucide="link" class="lucide lucide-link w-4 h-4 opacity-80"><path d="M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71" class=""></path><path d="M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71" class=""></path></svg>
</button>
</div>