<section class="py-20 2xl:py-40 bg-gray-800">
<div class="container px-4 mx-auto">
<div class="max-w-5xl mx-auto">
<div class="relative pt-16 px-6 lg:px-24 pb-20 bg-gray-600 rounded-3xl overflow-hidden">
<img class="absolute top-0 left-0" src="zospace-assets/lines/blue-half-circle.svg" alt="">
<img class="hidden lg:block absolute top-0 right-0 mt-6 mr-12" src="zospace-assets/images/stars.svg" alt="">
<img class="hidden lg:block absolute top-0 right-0 w-96 h-96 -mt-14 -mr-14" src="zospace-assets/lines/circle.svg" alt="">
<div class="relative">
<span class="text-base lg:text-lg text-white font-bold">More news</span>
<h3 class="mt-6 mb-12 text-5xl lg:text-6xl text-white font-bold font-heading">Subscribe now</h3>
<div class="sm:max-w-md mb-8 sm:flex sm:items-center sm:bg-white sm:rounded-full">
<span class="hidden sm:inline-block pl-2 sm:pl-6 lg:pl-10">
<svg width="37" height="37" viewbox="0 0 37 37" fill="none" xmlns="http://www.w3.org/2000/svg"><circle cx="18.5" cy="18.5" r="9.5" fill="#1F40FF" fill-opacity="0.15"></circle><circle cx="18.5" cy="18.5" r="18.5" fill="#1F40FF" fill-opacity="0.06"></circle><circle cx="18.5" cy="18.5" r="2.5" fill="#282C36"></circle></svg>
</span>
<input class="w-full sm:w-auto mb-4 sm:mb-0 pl-8 sm:pl-4 py-5 rounded-full placeholder-gray-900 font-bold focus:outline-none" type="email" placeholder="Drop your Email">
<button class="w-full sm:w-auto ml-auto px-10 py-5 text-white font-bold bg-blue-500 hover:bg-blue-600 rounded-full transition duration-200">Subscribe</button>
</div>
<p class="text-gray-200">
<span>The brown fox jumps over</span>
<span class="text-white">the lazy dog.</span>
</p>
</div>
</div>
</div>
</div>
</section>Framework
Tailwind CSS
UI Library
All Libraries
Components
- Alert 80
- Application 80
- Banner 20
- Blog 100
- Call to action 152
- Careers 20
- Contact 76
- Content 65
- Cookies 79
- E-commerce (orders) 28
- E-commerce (products) 49
- FAQ 66
- Features 170
- Footers 100
- Graphs 19
- HTTP codes 77
- Headers 122
- How it works 99
- Logo clouds 120
- Modals 8
- Navbar 44
- Navigation (horizontal) 146
- Navigation (vertical) 2
- Newsletter 87
- Portfolio 77
- Pricing 94
- Reviews 10
- Rich text 3
- Sign in / Sign up 120
- Stats 115
- Tables 56
- Team 85
- Testimonials 107
- Users 17
Component #1
Newsletters are the bread and butter of any business. Our Tailwind components newsletter will allow you to build your mailing base effectively.
Choose from many variations of the Tailwind components newsletter. The variants shown here are available in various UI libraries in the Shuffle editor. You will also find many other types of components that will be in the same style. This will allow you to build a comprehensive Tailwind website template. Each library is designed by a professional designer and coded by our team of developers.
Get access to all sections of the Tailwind components newsletter, code and our editor. Try the demo for free.
Component #2
Component #3
Component #4
Component #5
Component #6
Component #7
Component #8
Component #9
Component #10
