Home
Mr Robot
Fancy blog post card

Fancy blog post card

This tailwind example is contributed by Mr Robot, on 14-Feb-2023. Component is made with Tailwind CSS v3. It is responsive.

Card

Author Mr Robot

11.7k

Fork Fullscreen

<a href="#">
            <img class="w-full" src="https://images.pexels.com/photos/5120892/pexels-photo-5120892.jpeg?auto=compress&amp;cs=tinysrgb&amp;fit=crop&amp;h=625.0&amp;sharp=10&amp;w=1000" alt="Sunset in the mountains">
        </a>
        <div class="relative -mt-16 px-10 pt-5 pb-16 bg-white m-10">
            <a href="#"
                class="font-semibold text-lg inline-block hover:text-indigo-600 transition duration-500 ease-in-out inline-block mb-2">The
                Best Activewear from the Nordstrom Anniversary Sale</a>
            <p class="text-gray-500 text-sm">
                Today, I’m covering one of my favorite parts of the Nordstrom Anniversary Sale: the activewear!
            </p>
            <p class="mt-5 text-gray-600 text-xs">
                By
                <a href="#" class="text-xs text-indigo-600 transition duration-500 ease-in-out">
                    Mehdi Ahmadi
                </a> | in <a href="#" class="text-xs text-indigo-600 transition duration-500 ease-in-out">
                    Cooking
                </a>, <a href="#" class="text-xs text-indigo-600 transition duration-500 ease-in-out">
                    Recipe
                </a>
            </p>
        </div>

</div>

Related Examples

Image card with overlay text overlay

Author:
Santos78

2 years ago

29.6k
Tailwind image card with text above it

Author:
I.P. Leroy

2 years ago

22.4k
Call to action card with image
Responsive card with image

Author:
Noah Schmidt

2 years ago

15.2k
Tailwind card

Author:
Conan Hilton

2 years ago

12.2k
Card grid section
Display article/blog grid

Author:
Mr Robot

2 years ago

25.6k
Card with image full width
This component is a card designed for showcasing featured blog posts. It includes the post title, a captivating image, category links, and author details.

Author:
Mr Robot

2 years ago

12.7k
Hover effect card

Author:
Samuel Dawson

2 years ago

28.7k
Responsive Card Grid
Tailwind CSS responsive grid for feature listing. The cards have a teal background, rounded corners, and a concise display of feature titles, descriptions, and a "Learn More" link.

Author:
Amit Pachange

2 years ago

49.1k
User Profile Card
The card features a user's profile picture, name, location, and options for interactions. It has a clean and modern design with rounded edges and icons for user engagement. It also has support for dark mod:

Author:
Prashant

2 years ago

60.7k
Department Card

Author:
Ashok Kumar

10 months ago

1.2k
Profile Card
Show more details on hover

Author:
Tamani Phiri

1 year ago

13.3k
google ui cards
google ui cards

Author:
Anonymous

1 year ago

9.1k

Explore components by Tags

Didn't find component you were looking for?

Search from 2100+ components