News feed

This tailwind example is contributed by Bunny, on 05-Jun-2023. Component is made with Tailwind v3.4. It is responsive.

Tailwind v3.4 14.3k 7

<div class="bg-white rounded-lg shadow-md border p-4">
            <div class="flex items-center mb-4">
                <img class="w-12 h-12 rounded-full mr-3" src="https://randomuser.me/api/portraits/men/22.jpg" alt="Profile Image">
                <div>
                    <h2 class="text-lg font-semibold">John Doe</h2>
                    <p class="text-gray-500 text-sm">Published on June 17, 2023</p>
                </div>
            </div>
            <p class="text-gray-700 mb-4">
                Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed ac orci
                fermentum, viverra erat at, accumsan elit. Proin ultrices auctor nisl, eu facilisis lectus condimentum
                eu.
            </p>
            <div class="flex justify-end">
                <a href="#" class="text-blue-500 font-semibold">Read More</a>
            </div>
        </div>

<div class="bg-white rounded-lg shadow-md border p-4 mt-4">
            <div class="flex items-center mb-4">
                <img class="w-12 h-12 rounded-full mr-3" src="https://randomuser.me/api/portraits/women/45.jpg" alt="Profile Image">
                <div>
                    <h2 class="text-lg font-semibold">Jane Smith</h2>
                    <p class="text-gray-500 text-sm">Published on June 15, 2023</p>
                </div>
            </div>
            <p class="text-gray-700 mb-4">Ut tincidunt arcu ut mauris gravida, ac volutpat justo tristique. Phasellus ut
                pharetra velit. Nullam vel justo id felis tincidunt venenatis. Proin id ligula ut dui rhoncus feugiat.
            </p>
            <div class="flex justify-end">
                <a href="#" class="text-blue-500 font-semibold">Read More</a>
            </div>        </div>
    </div>
</div>

Related Examples

Question & Answer
questions and answers

Anonymous

3 years ago

9.3k
Invoice template

Shakti

3 years ago

28.8k
Chat template
fullscreen chat template suitable for mobile devices

Manon Daniel

3 years ago

18.3k
Google map iframe with tailwind

Kofi Osei

3 years ago

22.5k
background animation
background animation

Anonymous

3 years ago

53.2k
Responsive layout with header, main body, aside (sidebar) and footer

Ahmed Malik

3 years ago

13.2k
OTP Verification Page
A responsive and interactive OTP verification page built with Tailwind CSS. The page features a gradient background, hover effects, and animations to enhance user experience. It includes input fields for the OTP, a resend OTP link, and a verify button. The design is optimized for both light and dark modes.

Mohit Prajapat

1 year ago

1.4k
Hero

ORGIN_DREAMS

1 year ago

2.2k
Login with social media

Anonymous

1 week ago

10
ServerHub Interface

МОЙДОЫР

1 year ago

1.3k
3D Count downer

Hasan AlDoy (McDoy)

6 months ago

321
chat bar
live chat

gidy

1 year ago

2.3k