Home
Bunny
News feed

News feed

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

Other

Author Bunny

13.2k

Fork Fullscreen

<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

Author:
Anonymous

1 year ago

8.3k
Invoice template

Author:
Shakti

2 years ago

26.9k
Chat template
fullscreen chat template suitable for mobile devices

Author:
Manon Daniel

2 years ago

17k
Google map iframe with tailwind

Author:
Kofi Osei

2 years ago

20.7k
background animation
background animation

Author:
Anonymous

1 year ago

46k
Comparison Pricing Table Component
A responsive pricing table built with HTML and Tailwind CSS, comparing two plans (Free and Unlimited) with a clear feature checklist. Includes distinct styling for the premium plan and a toggle for monthly/annual pricing display.

Author:
Hamza Atig

2 months ago

384
Chat Bot
Simulation of a chat bot that can be used for conversations as a sketch idea

Author:
Ameth Galarcio

11 months ago

2.8k
Invoice
Invoice

Author:
Tanvir Hasan Bappy (Tanvir)

3 months ago

387
404 Page Not Found

Author:
KULDEEP

2 weeks ago

122
Interactive Game Flip Card – Pure HTML & CSS Component
An elegant and interactive game info flip card built purely with HTML and CSS. This component flips smoothly on hover to reveal detailed game information on the back, providing a modern and engaging way to showcase your games without using JavaScript. Perfect for gaming websites wanting sleek animations and clean design.

Author:
Code Master(Mfuranziza Dusabe Hamza)

1 month ago

225
Verify OTP
verification code

Author:
gidy

1 month ago

146
Boarding Pass Design
Testing out a layout and design for a digital boarding pass

Author:
Kirsten F

3 weeks ago

124

Explore components by Tags

Didn't find component you were looking for?

Search from 2400+ components