diff --git a/website/sass/index.scss b/website/sass/index.scss
index 533c42ef..03430db2 100644
--- a/website/sass/index.scss
+++ b/website/sass/index.scss
@@ -230,99 +230,118 @@
 }
 
 #community {
-	#newsletter form {
-		width: 100%;
-		margin-top: 40px;
-		display: flex;
-		gap: 20px;
-		flex-wrap: wrap;
-
-		.same-line {
-			display: flex;
-			gap: 20px;
-			flex: 100000 1 0;
-
-			@media screen and (max-width: 1200px) {
-				flex-direction: column;
-				flex: 1 1 100%;
-
-				&.name,
-				&.email {
-					flex: 1 1 100%;
-				}
+	#newsletter {
+		#newsletter-success {
+			background: var(--color-crimson);
+			margin-top: 40px;
+			padding: 40px;
+			width: 100%;
+			color: var(--color-fog);
+			box-sizing: border-box;
+			
+			&:not(:target) {
+				display: none;
 			}
 		}
 
-		.column {
+		#newsletter-success:target ~ form {
+			display: none;
+		}
+
+		form {
+			width: 100%;
+			margin-top: 40px;
 			display: flex;
-			flex-direction: column;
-			justify-content: flex-end;
+			gap: 20px;
+			flex-wrap: wrap;
 
-			&.name {
-				flex: 1 0 0;
-				min-width: 240px;
-				
+			.same-line {
+				display: flex;
+				gap: 20px;
+				flex: 100000 1 0;
+
+				@media screen and (max-width: 1200px) {
+					flex-direction: column;
+					flex: 1 1 100%;
+
+					&.name,
+					&.email {
+						flex: 1 1 100%;
+					}
+				}
 			}
 
-			&.phone {
-				display: none;
-			}
+			.column {
+				display: flex;
+				flex-direction: column;
+				justify-content: flex-end;
 
-			&.email {
-				flex: 1 0 0;
-				min-width: 240px;
-			}
+				&.name {
+					flex: 1 0 0;
+					min-width: 240px;
+					
+				}
+
+				&.phone {
+					display: none;
+				}
 
-			@media screen and (max-width: 400px) {
-				&.name,
 				&.email {
-					min-width: 100%;
+					flex: 1 0 0;
+					min-width: 240px;
 				}
-			}
 
-			&.submit {
-				flex: 1 0 0;
-			}
-
-			label,
-			input {
-				flex: 0 0 auto;
-			}
-
-			label {
-				font-size: var(--font-size-link);
-				font-weight: 800;
-				margin-bottom: 10px;
-				line-height: 1;
-			}
-
-			input:not([type="submit"]) {
-				flex: 0 0 auto;
-				width: 100%;
-				height: calc(var(--font-size-link) * 2);
-				font-size: calc(var(--font-size-link) * 0.9);
-				color: inherit;
-				border: 2px solid currentColor;
-				outline: none;
-				margin: 0;
-				padding: 0 var(--font-size-link);
-				font-family: inherit;
-				font-weight: inherit;
-				box-sizing: border-box;
-
-				&:focus {
-					border-color: var(--color-mustard);
+				@media screen and (max-width: 400px) {
+					&.name,
+					&.email {
+						min-width: 100%;
+					}
 				}
-			}
 
-			input[type="submit"] {
-				background: none;
-				outline: none;
-				cursor: pointer;
+				&.submit {
+					flex: 1 0 0;
+				}
 
-				&:focus {
-					border-color: var(--color-mustard);
-					color: var(--color-mustard);
+				label,
+				input {
+					flex: 0 0 auto;
+				}
+
+				label {
+					font-size: var(--font-size-link);
+					font-weight: 800;
+					margin-bottom: 10px;
+					line-height: 1;
+				}
+
+				input:not([type="submit"]) {
+					flex: 0 0 auto;
+					width: 100%;
+					height: calc(var(--font-size-link) * 2);
+					font-size: calc(var(--font-size-link) * 0.9);
+					color: inherit;
+					border: 2px solid currentColor;
+					outline: none;
+					margin: 0;
+					padding: 0 var(--font-size-link);
+					font-family: inherit;
+					font-weight: inherit;
+					box-sizing: border-box;
+
+					&:focus {
+						border-color: var(--color-mustard);
+					}
+				}
+
+				input[type="submit"] {
+					background: none;
+					outline: none;
+					cursor: pointer;
+
+					&:focus {
+						border-color: var(--color-mustard);
+						color: var(--color-mustard);
+					}
 				}
 			}
 		}
diff --git a/website/templates/index.html b/website/templates/index.html
index 8ca2fcf8..8762044e 100644
--- a/website/templates/index.html
+++ b/website/templates/index.html
@@ -223,11 +223,15 @@
 				Graphite is early in development and the most exciting, ambitious features are still to come. Enter your email below to receive only occasional announcements when major updates are
 				ready for your enjoyment. The first newsletter will likely be sent out for the Graphite alpha milestone 2 release, featuring node-based editing, later this year.
 			</p>
+			<div id="newsletter-success">
+				<h4>Thanks!</h4>
+				<p>You'll receive the first newsletter with the next major Graphite news.</p>
+			</div>
 			<form action="https://graphite.rs/newsletter-signup" method="post">
 				<div class="same-line">
 					<div class="column name">
 						<label for="newsletter-name">First + last name:</label>
-						<input id="newsletter-name" name="name" type="text" />
+						<input id="newsletter-name" name="name" type="text" required />
 					</div>
 					<div class="column phone">
 						<label for="newsletter-phone">Phone:</label>
@@ -235,7 +239,7 @@
 					</div>
 					<div class="column email">
 						<label for="newsletter-email">Email address:</label>
-						<input id="newsletter-email" name="email" type="email" />
+						<input id="newsletter-email" name="email" type="email" required />
 					</div>
 				</div>
 				<div class="column submit">