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

10.5k

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

1 year ago

26.7k
Tailwind image card with text above it

Author:
I.P. Leroy

1 year ago

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

Author:
Noah Schmidt

1 year ago

14k
Tailwind card

Author:
Conan Hilton

1 year ago

11k
Card grid section
Display article/blog grid

Author:
Mr Robot

1 year ago

21.9k
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

1 year ago

11.3k
Hover effect card

Author:
Samuel Dawson

1 year ago

24.8k
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

44.5k
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

55.8k
Responsive card grid
responsive card grid for articles

Author:
Mr Robot

1 year ago

12.5k
Testimonial card with image

Author:
Simon Scheffer

1 year ago

10.1k
Blog Card
A blog card with dark-mode

Author:
Robert Chunga

1 week ago

32

Explore components by Tags

Didn't find component you were looking for?

Search from 1800+ components