Home
Emdadul Islam
Modern responsive Newsletter form

Modern responsive Newsletter form

Responsive newsletter subscriber form

This tailwind example is contributed by Emdadul Islam, on 04-Jun-2024. Component is made with Tailwind CSS v3. It is responsive. It supports dark mode. similar terms for this example are CTA,banner,Email campaign

Call to Action Form Newsletter

Author Emdadul Islam

1.7k

Fork Fullscreen

<section>
  
  <div class="mx-auto w-full max-w-7xl px-5 py-16 md:px-10 md:py-24 lg:py-32">
    
    <div class="bg-blue-50 p-8 text-center sm:p-10 md:p-16">
      
      <h2 class="mb-4 text-3xl font-bold md:text-5xl">Join the TailwindFlex Community</h2>
      <p class="mx-auto mb-6 max-w-2xl text-[#647084] md:mb-10">Lorem ipsum dolor sit amet, consectetur adipiscing elit ut aliquam, purus sit amet luctus venenatis, lectus magna fringilla urna</p>
      
      <form name="email-form" method="get" class="relative mx-auto mb-4 flex w-full max-w-2xl flex-col items-start justify-center sm:flex-row">
        <input type="email" class="mb-3 mr-6 block h-9 w-full bg-white px-6 py-7 text-sm text-[#333333] focus:border-[#3898ec]" placeholder="Enter your email" required="" />
        <input type="submit" value="Subscribe" class="inline-block w-full cursor-pointer bg-[#276ef1] px-6 py-3 text-center font-semibold text-white transition [box-shadow:rgb(171,_196,_245)_-8px_8px] hover:[box-shadow:rgb(171,_196,_245)_0px_0px] sm:w-28" />
      </form>
    </div>
  </div>
</section>

Related Examples

Sign up for newsletter form

Author:
Amit Pachange

1 year ago

11.4k
Newsletter Signup Form
It features a clean and modern design with a background illustration, making it visually appealing.

Author:
TailwindFlex

1 year ago

7.5k
Domain For Sale Template
Domain For Sale Template

Author:
Geoffrey Callaghan

1 year ago

3.5k
Waitlist signup form

Author:
Anonymous

1 year ago

3.3k
Chat Bot
Simulation of a chat bot that can be used for conversations as a sketch idea

Author:
Ameth Galarcio

9 months ago

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

Author:
Ranit Saha

3 months ago

636
stepper
The Stepper Component is a versatile and user-friendly tool designed to guide users through a sequence of steps. Whether you're building a multi-step form, a tutorial, or any process that requires sequential navigation, this component makes it easy to implement and customize.

Author:
Abhiraj

2 months ago

573
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

1 month ago

318
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

6 days ago

25
Responsive CTA
Tailwind CTA card

Author:
Dika Rahman

1 year ago

1.6k
Geaux Code CTA Section
CTA with background patterns

Author:
Andrew Weisbeck

8 months ago

936
Tag input with Tailwind CSS and Alpinejs

Author:
Michael Andreuzza

11 months ago

2.1k

Explore components by Tags

Didn't find component you were looking for?

Search from 2100+ components