Home
Amit Pachange
Sign up for newsletter form

Sign up for newsletter form

This tailwind example is contributed by Amit Pachange, on 15-Jun-2023. Component is made with Tailwind CSS v3. It is responsive. similar terms for this example is Email campaign

Form Newsletter

Author Amit Pachange

11.7k

Fork Fullscreen

<div class="max-w-screen-xl mx-auto lg:flex lg:items-center p-10 mt-10 ml-10">
    <div class="lg:w-0 lg:flex-1">
        <h2 id="newsletter-headline"
            class="text-2xl leading-9 tracking-tight text-gray-700 font-semilbold sm:text-4xl sm:leading-10">
            Sign up for our newsletter
        </h2>
        <p class="max-w-3xl mt-3 text-gray-500">
            Stay up-to-date on news and updates about this project by email.
        </p>
    </div>
    <div class="max-w-md mt-8 lg:mt-0 lg:ml-8">
        <form aria-labelledby="newsletter-headline">
            <div class="">
                <div class="sm:flex items-center">
                    <input name="EMAIL" type="email" required="required" placeholder="Enter your email" aria-label="Email address" class="w-full px-5 py-3 text-base leading-6 transition duration-150 ease-in-out border-2 rounded-md appearance-none focus:outline-none sm:max-w-xs border-gray-200 text-gray-900 placeholder-gray-500 focus:placeholder-gray-400 bg-white">
                    <div class="mt-3 sm:mt-0 sm:ml-3 sm:flex-shrink-0">
                        <button type="submit" class="block px-5 py-3 text-white transition duration-100 ease-in-out bg-blue-500 border border-transparent rounded shadow-sm hover:bg-blue-600 focus:border-blue-500 focus:ring-2 focus:ring-blue-500 focus:outline-none focus:ring-opacity-50 disabled:opacity-50 disabled:cursor-not-allowed">
                  Notify me
                </button>
                    </div>
                </div>
            </div>
        </form>
        <p class="mt-3 text-sm leading-5 text-gray-500">
            I will never spam or share your email under any circustance.
        </p>
    </div>
</div>

Related Examples

Newsletter subscription form
with radial gradient background

Author:
Eamon Carter

2 years ago

10.9k
Subscribe to our newsletter section

Author:
Bunny

2 years ago

9.8k
Subscribe to newsletter section

Author:
Sophia Baker

2 years ago

11k
Modern responsive Newsletter form
Responsive newsletter subscriber form

Author:
Emdadul Islam

1 year ago

2.1k
Email format
This is a ui component to be used to send emails with custom design (deigned with tailwindcss)

Author:
Ranit Saha

7 months ago

952
Responsive Form
This modern, fully responsive account creation form is designed using HTML and Tailwind CSS, ensuring a clean, professional, and accessible user experience. It features a card-based layout with smooth spacing, a subtle shadow effect, and a structured grid system for optimal responsiveness across all devices.

Author:
Rajesh Maheshwari

5 months ago

847
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

334
File Upload

Author:
Rajesh Maheshwari

5 months ago

642
Responsive Classes List Table with Edit and Delete buttons using Tailwind CSS
This responsive classes list table is built using Tailwind CSS and features: - A clean layout with a header displaying column titles. - Action buttons for editing and deleting entries. - Responsive design that adapts to various screen sizes. - Easy customization options to fit your project's needs.

Author:
Anum Shahana

10 months ago

2.4k
User registration form

Author:
Leon Bachmann

2 years ago

23.2k
Default phone input

Author:
Md. Tofayel islam

1 year ago

2.6k
update user
it is the layout for creating an event

Author:
seth dridi

11 months ago

1.7k

Explore components by Tags

Didn't find component you were looking for?

Search from 2400+ components