卡片 · Brown Cheetah

类型：组件　·　分类：卡片　·　收录：2026-09-19　·　源码：会员可见

[hidecontent type="vip1"]

<!-- From Uiverse.io by Qasimsaifi - Tags: blue, card, card template, cool card, cardhover , card animation -->
<div class="w-80 p-4 bg-white rounded-lg shadow-md transform hover:scale-105 transition-transform duration-300 ease-in-out">
        <img class="w-full h-40 object-cover rounded-t-lg" alt="Card Image" src="https://via.placeholder.com/150">
        <div class="p-4">
            <h2 class="text-xl  font-semibold">Beautiful Card</h2>
            <p class="text-gray-600">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam quis ante sit amet tellus ornare tincidunt.</p>
            <div class="flex justify-between items-center mt-4">
                <button class="bg-blue-500 hover:bg-blue-600 text-white px-4 py-2 rounded-full focus:outline-none focus:ring-2 focus:ring-blue-400">Learn More</button>
            </div>
        </div>
    </div>

[/hidecontent]