Home
Sophia Baker
Comment form

Comment form

This tailwind example is contributed by Sophia Baker, on 30-Jan-2023. Component is made with Tailwind CSS v3. It is responsive.

Form Comment Section

Author Sophia Baker

11.9k

Fork Fullscreen

<div class="border border-gray-300 p-4 rounded-lg max-w-xl mx-auto mt-40">
    <h2 class="text-lg font-medium mb-2">Leave a comment</h2>
    <form>
        <div class="mb-4">
            <label class="block text-gray-700 font-medium mb-2" for="name">
                Name
            </label>
            <input
                class="appearance-none border rounded w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:border-gray-500"
                id="name" type="text" placeholder="Enter your name">
        </div>
        <div class="mb-4">
            <label class="block text-gray-700 font-medium mb-2" for="comment">
                Comment
            </label>
            <textarea rows="4"
                class="appearance-none border rounded w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:border-gray-500"
                id="comment" placeholder="Enter your comment"></textarea>
        </div>
        <div class="flex justify-end">
            <button
                class="bg-blue-500 hover:bg-blue-700 text-white font-medium py-2 px-4 rounded focus:outline-none focus:shadow-outline"
                type="button">Post Comment</button>
        </div>
    </form>
</div>

Related Examples

Comment section
Minimal comment section for your project

Author:
Prajwal Hallale

2 years ago

17.6k
Form for editing items

Author:
Sophia Baker

2 years ago

16.7k
Whatsapp like chat design

Author:
Simon Scheffer

2 years ago

12.9k
Nested comment section
This is a comment thread with a reply, up-vote, and down-vote buttons.

Author:
Prajwal Hallale

2 years ago

14.2k
Post Detail
Post detail with form

Author:
Sedat Kumcu

9 months ago

1.2k
Review popup form with toggle and stars
Review popup form with toggle and stars

Author:
Ayman Reifoun

3 months ago

489
Extreme Signup Page
I create a signup page using html, tailwindcss and font awesome icons using cdn.

Author:
Akram Khan

1 year ago

2.3k
Radio Input Group
Just fancy radio input group

Author:
farid

1 week ago

97
Login / Register Form
Tailwind CSS styling only – no frameworks required Smooth tab switch with JavaScript Fully responsive for mobile and desktop Clean, modern form design with interactive elements

Author:
KULDEEP

1 month ago

358
Contact us section
Minimal contact us form

Author:
Leon Bachmann

2 years ago

11.5k
Login page with tailwind (SB admin 2)
This component features a split-screen design with a background image on one side and a registration form on the other.

Author:
Anonymous

1 year ago

2.8k
Modern Dark Footer with Overlapping Gradient CTA
A comprehensive, dark-themed website footer component built with HTML and Tailwind CSS. It features a visually distinct overlapping section with a colorful gradient background containing a prominent call-to-action (CTA) block. The main footer area utilizes a multi-column grid layout for organized navigation links, a newsletter signup form, and social media icons. A final bottom bar includes legal links and copyright information. The design is responsive and adapts its layout for different screen sizes.

Author:
Hamza Atig

3 months ago

255

Explore components by Tags

Didn't find component you were looking for?

Search from 2400+ components