Home
Dipti narayan
Basic newsletter section

Basic newsletter section

This tailwind example is contributed by Dipti narayan, on 06-Sep-2023. Component is made with Tailwind CSS v3. It is responsive. similar terms for this example is Email campaign

Newsletter

Author Dipti narayan

7.3k

Fork Fullscreen

<div class="flex justify-center bg-gray-50 mt-40">
  <div class="max-w-screen-xl px-4 py-12 mx-auto sm:px-6 lg:py-16 lg:px-8">
    <h2 class="text-3xl font-extrabold leading-normal tracking-tight text-center text-gray-900 sm:text-4xl">
      <p>
        Want updates about big releases and product launches?
      </p>
      <p>
        <span class="text-indigo-600">Sign up for our newsletter.</span>
      </p>
    </h2>
    <form action="https://github.us3.list-manage.com/subscribe/post?u=6a33c422777aedd88e9a9488e&amp;id=9b99f013b8"
      method="post" target="_blank" class="justify-center mt-8 sm:flex">
      <input aria-label="Email address" name="EMAIL" type="email" required="" class="w-full px-5 py-3 text-base leading-6 text-gray-900 placeholder-gray-500 transition duration-150 ease-in-out bg-white border border-gray-300 rounded-md appearance-none focus:outline-none focus:shadow-outline focus:border-blue-300 sm:max-w-xs" placeholder="Enter your email">
      <input type="hidden" value="8" name="group[27425][8]" id="mce-group[27425]-27425-3">
      <div class="mt-3 rounded-md shadow sm:mt-0 sm:ml-3 sm:flex-shrink-0">
        <button class="flex items-center justify-center w-full px-5 py-3 text-base font-medium leading-6 text-white transition duration-150 ease-in-out bg-indigo-600 border border-transparent rounded-md hover:bg-indigo-500 focus:outline-none focus:shadow-outline">
        Notify me
      </button>
      </div>
    </form>
  </div>
</div>

Related Examples

Newsletter subscription form
with radial gradient background

Author:
Eamon Carter

2 years ago

11k
Tailwind Email Newsletter Form

Author:
Sameer Sultana

2 years ago

12.9k
Subscription
Subscription list

Author:
Abhiraj

8 months ago

687
Newsletter subscription card

Author:
Samuel Dawson

2 years ago

10k
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

8 months ago

1.2k
Newsletter form

Author:
Leon Bachmann

2 years ago

10.1k
newsletter
Subscribe to our newsletter for latest updates and offers.

Author:
ORGIN_DREAMS

5 months ago

569
Newsletter Subscription Form

Author:
Moriba Traore

2 years ago

11.1k
Newsletter form with SVG gradient background

Author:
Erik Hyatt

2 years ago

11.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

7 months ago

764
Newsletter
This template ensures your newsletter stands out with smooth animations, professional design, and a responsive layout.

Author:
ishimwe shadad

5 months ago

317
Newsletter
Newsletter section

Author:
Alok

3 years ago

10.9k

Explore components by Tags

Didn't find component you were looking for?

Search from 3000+ components