Home
JaxStone
Feedback Form

Feedback Form

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

Form

Author JaxStone

14.7k

Fork Fullscreen

<form class="max-w-md mx-auto mt-20 p-6 bg-white border rounded-lg shadow-lg">
    <h2 class="text-2xl font-bold mb-6">Feedback Form</h2>
    <div class="mb-4">
        <label class="block text-gray-700 font-bold mb-2" for="name">
      Name:
    </label>
        <input class="shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline" id="name" type="text" placeholder="Enter your name">
    </div>
    <div class="mb-4">
        <label class="block text-gray-700 font-bold mb-2" for="email">
      Email:
    </label>
        <input class="shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline" id="email" type="email" placeholder="Enter your email">
    </div>
    <div class="mb-4">
        <label class="block text-gray-700 font-bold mb-2" for="feedback">
      Feedback:
    </label>
        <textarea class="shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline" id="feedback" rows="5" placeholder="Enter your feedback"></textarea>
    </div>
    <button class="bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded focus:outline-none focus:shadow-outline" type="submit">
    Submit
  </button>
</form>

Related Examples

Feedback form
Collect opinions about your company's service

Author:
Arya

3 years ago

13.7k
Survey form
User survey form

Author:
JaxStone

2 years ago

16.2k
Responsive Contact Section Using Tailwind CSS
This HTML and Tailwind CSS snippet creates a visually appealing and responsive contact section. Designed to adapt seamlessly across different screen sizes, this component features two main areas: the contact information block and a contact form. The contact block displays essential details like phone, email, and address, alongside social media links, all encapsulated within a cyan-themed card with rounded corners and shadow effects for depth. The form area, highlighted with a contrasting white background, ensures a user-friendly interface for submitting contact details. This code snippet is perfect for integration into any modern web application requiring a responsive and stylish contact section.

Author:
Fathallah Anass

1 year ago

2.1k
Contact us form template with fabform

Author:
Ho O

8 months ago

920
Profile Form
Enhanced User Profile Form with Stunning Profile and Cover Image Fields

$$@(\/)(\/)Y$ Author:
$@(\/)(\/)Y

1 year ago

9.4k
Payment Form

Author:
ABDO-SY

6 months ago

928
Contact Us form

Author:
ABDO-SY

5 months ago

799
Contact Us / Enquiry-form Responsive

Author:
KULDEEP

2 months ago

657
Responsive contact us section

Author:
Ron Hicks

2 years ago

14.5k
Glassmorphism form

Author:
Sophia Baker

2 years ago

17.6k
tailwind contact form
tailwind contact form

Author:
Geoffrey Callaghan

1 year ago

3k
progress-bar with Tailwind CSS and Alpinejs

Author:
Michael Andreuzza

1 year ago

1.8k

Explore components by Tags

Didn't find component you were looking for?

Search from 2400+ components