Powerful Card Designs

Elevate your designs with Tailwind CSS cards. Learn to build stunning feature cards efficiently. Perfect for modern UI enthusiasts.

299
1
HTML + Tailwind
<a href="javascrip:;" class="relative block h-[250px] w-[250px] pt-8 px-8 pb-5 rounded-3xl bg-indigo-50 hover:bg-indigo-100 transition duration-200 shadow"> <div class="flex flex-col h-full justify-between max-w-sm pr-16"> <p class="text-sm text-gray-900 mb-10 md:mb-6">It's essential for us to share our workflow in order to build trust with you.</p> <span class="text-3xl font-semibold text-gray-900">See our workflow</span> </div> <svg class="absolute bottom-0 right-0 m-5" width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M17.92 6.62C17.8185 6.37565 17.6243 6.18147 17.38 6.08C17.2598 6.02876 17.1307 6.00158 17 6H7C6.73478 6 6.48043 6.10536 6.29289 6.29289C6.10536 6.48043 6 6.73478 6 7C6 7.26522 6.10536 7.51957 6.29289 7.70711C6.48043 7.89464 6.73478 8 7 8H14.59L6.29 16.29C6.19627 16.383 6.12188 16.4936 6.07111 16.6154C6.02034 16.7373 5.9942 16.868 5.9942 17C5.9942 17.132 6.02034 17.2627 6.07111 17.3846C6.12188 17.5064 6.19627 17.617 6.29 17.71C6.38296 17.8037 6.49356 17.8781 6.61542 17.9289C6.73728 17.9797 6.86799 18.0058 7 18.0058C7.13201 18.0058 7.26272 17.9797 7.38458 17.9289C7.50644 17.8781 7.61704 17.8037 7.71 17.71L16 9.41V17C16 17.2652 16.1054 17.5196 16.2929 17.7071C16.4804 17.8946 16.7348 18 17 18C17.2652 18 17.5196 17.8946 17.7071 17.7071C17.8946 17.5196 18 17.2652 18 17V7C17.9984 6.86932 17.9712 6.74022 17.92 6.62V6.62Z" fill="black"></path> </svg> </a>
Abdelmjid Saber

Abdelmjid Saber

@abdelmjid

I love learning and creating something new fast, secure and clean code applications.