Home
Mr Robot
Card with Thumbnail

Card with Thumbnail

Post card with image

This tailwind example is contributed by Mr Robot, on 20-Jul-2022. Component is made with Tailwind CSS v3.

Card

11k

<div class="max-w-sm mb-6 md:md-0 col-span-12 sm:col-span-6 lg:col-span-4 border p-4 rounded-lg shadow-lg">
    <a href="#">
        <img srcset="https://laravelnews.imgix.net/images/laravel9-1646792144.jpg?ixlib=php-3.3.1 1x,https://laravelnews.imgix.net/images/laravel9-1646792144.jpg?dpr=2&amp;ixlib=php-3.3.1 2x" src="https://laravelnews.imgix.net/images/laravel9-1646792144.jpg?ixlib=php-3.3.1" class="w-full mb-4 rounded-lg shadow-none transition transition-shadow duration-500 ease-in-out group-hover:shadow-lg" alt="laravel9-1646792144.jpg">
        <div class="flex items-center mb-3">
            <span class="inline-flex items-center px-3 py-0.5 rounded-full text-xs font-bold leading-5 text-white font-display mr-2 capitalize bg-red-500" >
               News
            </span>
            <p class="font-mono text-xs font-normal opacity-75 text-black">September 28th, 2022</p>
        </div>
        <p class="font-display max-w-sm text-2xl font-bold leading-tight">
            <span class="link-underline link-underline-black text-black">
              Laravel 9.32 Released
            </span>
        </p>
    </a>
</div>

Related Examples

Products card grid
Example of product card grid with product image and pricing

Author:
Noob

2 years ago

22.6k
Video card
Video card component for tailwind css

Author:
Rajesh kulkarni

2 years ago

16.5k
Image card with overlay text overlay

Author:
Santos78

2 years ago

30.6k
Simple product card

Author:
farid

9 months ago

1.2k
Coupon code card
Display Special Offer with Coupon Code

Author:
Dipti narayan

1 year ago

10.5k
Minimal Profile card

Author:
Abhijit Sen

2 years ago

11k
Card section
Card section. find it makecomponents.com

Author:
makecomponents

10 months ago

1.4k
Tailwind image slider
slider with navigation buttons and info about image

Author:
Anonymous

1 year ago

19.7k
Article card

Author:
Sienna

2 years ago

9.5k
Info card

Author:
Samuel Dawson

2 years ago

9.7k
Food Order Card
Ecommerce/Food order card layout

Author:
Rajesh Maheshwari

5 months ago

475
3D product Card
The product card has been fully recoded using a light (black-and-white) color theme. Let me know if you want to add more interactivity, change the layout, or adapt it for mobile or dark mode.

Author:
Nicole Shalom

2 months ago

362

Explore components by Tags

Didn't find component you were looking for?

Search from 2400+ components