Subscribe to newsletter section

This tailwind example is contributed by Sophia Baker, on 19-Jan-2023. Component is made with Tailwind v3.4. It is responsive. similar terms for this example is Email campaign

Newsletter

Author Sophia Baker

Tailwind v3.4 12.1k 11

Fork Fullscreen

<div class="flex justify-center px-2 my-[20%] bg-gray-900">
    <div class="max-w-2xl px-3 py-5 rounded-2xl md:px-8 md:py-7">
        <h4 class="text-2xl font-semibold tracking-wide text-white lg:text-3xl">Want more UI goodness?</h4>
        <p class="max-w-xl mt-2 leading-relaxed text-blue-100 lg:text-lg">
            Sign up and get notified whenever new
            components get added to the collection.
        </p>
        <div class="my-4 sm:flex sm:flex-row sm:justify-evenly">
            <input class=" block w-full px-4 py-3 mt-3 text-gray-800 placeholder-gray-500 bg-white border border-gray-300 rounded-md appearance-none sm:max-w-xs focus:outline-none focus:ring focus:ring-blue-50 focus:border-blue-300" type="email" placeholder="Enter your email" value="">
            <button class="bg-blue-300 hover:bg-blue-200 block w-full py-3 mt-3 font-bold tracking-wide rounded shadow sm:ml-3 md:w-52 text-gray-900 focus">
                <span class="block ">Subscribe</span>
            </button>
        </div>
    </div>
</div>

Related Examples

Sign up for newsletter form

Amit Pachange

3 years ago

12.7k
Newsletter Subscription Card

Anonymous

1 year ago

1.8k
Simple Footer 2

$$@(\/)(\/)¥$ $@(\/)(\/)¥

1 year ago

2.5k
Clean newsletter

Lucas Martinez

3 years ago

12.1k
Newsletter section

Anonymous

3 years ago

9.3k
AI Trends Showcase
A clean and modern intelligence feed component for showcasing AI, technology, startup, and research updates with automatic rotation, smooth navigation, and responsive layouts. Perfect For Showcase AI, technology, and innovation stories using a premium editorial-style carousel. Designed with a clean dark aesthetic, automatic slide rotation, interactive breadcrumbs, navigation controls, and a responsive layout that works seamlessly across desktop and mobile devices.

Ayyamperumal S

4 months ago

235
Newsletter Section
On your website or application, add a beautiful and responsive Newsletter Subscription Form. These Tailwind CSS Newsletter Forms are easy to use and customizable, allowing you to create a wide range of newsletter form styles that suit your website's design.

Alif Bima Pradana

8 months ago

446
Subscribe to Newsletter
Subscribe to Newsletter section with minimal design and black and white colors

Leon Bachmann

3 years ago

12.4k
Newsletter Subscription Form

Moriba Traore

3 years ago

11.7k
Subscribe to newsletter section

Leon Bachmann

3 years ago

12.2k
Best chat prompt

ORGIN_DREAMS

1 year ago

949
Tailwind Email Newsletter Form

Sameer Sultana

3 years ago

13.8k