Home
Mr Robot
Simple Form 3

Simple Form 3

This tailwind example is contributed by Mr Robot, on 05-Sep-2022. Component is made with Tailwind CSS v3.

Form

9.6k

<div class="bg-purple-600 min-h-screen flex items-center text-lg">
    <form action="" class="p-10 md:w-2/3 lg:w-1/2 mx-auto rounded">
        <div class="shadow">
            <div class="flex items-center bg-purple-400 rounded-t-lg border-purple-500 border-b">
                <label for="name" class="w-20 text-right mr-8 p-4 text-purple-200">Name</label>
                <input type="text" name="name" id="name" placeholder="Put in your name" class="flex-1 p-4 pl-0 bg-transparent placeholder-purple-300  outline-none text-white overflow-ellipsis overflow-hidden">
            </div>
            <div class="flex items-center bg-purple-400  rounded-b-lg border-purple-500 mb-10">
                <label for="twitter" class="w-20 text-right p-4 mr-8 text-purple-200">Twitter</label>
                <input type="text" name="twitter" id="twitter" placeholder="Put in Twitter pseudonym" class="flex-1 p-4 pl-0 bg-transparent placeholder-purple-300 outline-none text-white overflow-ellipsis overflow-hidden">
            </div>
        </div>
        <button class="bg-pink-400 block w-full rounded py-4 text-white font-bold shadow">Submit</button>

</form>
</div>

Related Examples

Login Form with Icon

Author:
Akai

5 months ago

169
Contact us page template
full page fancy contact us page

Author:
Lukas Müller

3 years ago

17.4k
signup
its a regstration form

Author:
ishimwe shadad

10 months ago

1.2k
Incentives
tailwind css Incentives

Author:
Anonymous

2 years ago

5.3k
Contact Form

Author:
Sophia Baker

3 years ago

10.6k
Text Rpg UI

Author:
Crimson

1 year ago

1.4k
Contact Form for fabform.io
Contact form that uses fabform.io

Author:
Ho O

1 year ago

985
form Événement
form Événement

Author:
Omer fils ELENGA

1 week ago

10
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

8 months ago

1.1k
User registration form

Author:
Laurits

3 years ago

11.7k
Book Appointment form
A schedule an appointment form is an online document that helps the user to schedule an appointment with the company or business.

Author:
Arya

3 years ago

12.8k
Multi-Step Form with Progress Indicator
reusable "Multi-Step Form with Progress Indicator" component built with HTML, CSS, and Tailwind CSS. It’s a practical component for forms like signups, surveys, or checkout processes.

Author:
Ayyamperumal S

1 year ago

2.1k

Explore components by Tags

Didn't find component you were looking for?

Search from 3000+ components