Email Subscription Form with Call to Action

HTML Email subscription form with responsive design and a clear call-to-action for your website. Easily build and host an email subscription form using this with FormBold. Get more subscribers, grow your list, and generate more revenue. Copy-paste the code on your HTML site and replace endpoint url with your own!

<div class="formbold-main-wrapper">
<!-- Author: FormBold Team -->
<!-- Learn More: -->
<div class="formbold-form-wrapper">
<div class="formbold-form-title">
<h3>Subscribe Now to Get Our Latest Offers!</h3>
<p>There are many variations of passages of Lorem Ipsum available but the majority have.</p>
<form action="" method="POST">
placeholder="Enter your email address"
<button class="formbold-btn">
Subscribe Now
@import url(';500;600;700&display=swap');
* {
margin: 0;
padding: 0;
box-sizing: border-box;
body {
font-family: "Inter", sans-serif;
.formbold-main-wrapper {
display: flex;
align-items: center;
justify-content: center;
padding: 48px;
.formbold-form-wrapper {
margin: 0 auto;
max-width: 550px;
width: 100%;
background: white;
.formbold-form-title {
margin-bottom: 40px;
.formbold-form-title h3 {
color: #07074D;
font-weight: 700;
font-size: 28px;
line-height: 35px;
width: 60%;
margin-bottom: 20px;
.formbold-form-title p {
font-size: 16px;
line-height: 24px;
color: #536387;
width: 70%;
.formbold-form-input {
text-align: center;
width: 100%;
padding: 14px 22px;
border-radius: 6px;
border: 1px solid #DDE3EC;
background: #FAFAFA;
font-weight: 500;
font-size: 16px;
color: #536387;
outline: none;
resize: none;
.formbold-form-input:focus {
border-color: #6a64f1;
box-shadow: 0px 3px 8px rgba(0, 0, 0, 0.05);
.formbold-btn {
text-align: center;
width: 100%;
font-size: 16px;
border-radius: 5px;
padding: 14px 25px;
border: none;
font-weight: 500;
background-color: #6A64F1;
color: white;
cursor: pointer;
margin-top: 15px;
.formbold-btn:hover {
box-shadow: 0px 3px 8px rgba(0, 0, 0, 0.05);