diff --git a/sass/_extra.scss b/sass/_extra.scss
index b92c17bfb..c9cfc4ea0 100644
--- a/sass/_extra.scss
+++ b/sass/_extra.scss
@@ -99,14 +99,24 @@ h6:hover .anchor {
     margin-bottom: 0;
 }
 
+input, button {
+    font-size: inherit;
+}
+
+input {
+    min-width: 0; // Allow the input to shrink on small devices.
+}
+
+a.btn, // Trick to increase the specificity and win against rules such as a:visited
 .btn {
     text-decoration: none;
     border-radius: 3px;
     font-weight: 600;
-    border: 1px solid transparent;
+    border: none;
     box-sizing: border-box;
     display: inline-block;
     padding: 0.4em 2em;
+    transition: background-color 125ms;
 
     background-color: $brand-color;
     color: $background-color;
@@ -114,10 +124,21 @@ h6:hover .anchor {
 
     &:hover {
         color: lighten($background-color, 10);
-        border-color: $brand-color;
+        background-color: lighten($brand-color, 5);
+    }
+
+    &:active {
+        background-color: darken($brand-color, 5);
     }
 }
 
+input[type=email] {
+    border-radius: 3px;
+    border: 1px solid $brand-color;
+    box-sizing: border-box;
+    padding: .4em;
+}
+
 // A hack for image captions.
 // See https://stackoverflow.com/questions/19331362/using-an-image-caption-in-markdown-jekyll
 img+em,
@@ -129,13 +150,39 @@ video+em {
 }
 
 .email-form {
-    display: flex;
+    display: grid;
+    margin-top: $spacing-unit;
+    grid-template-columns: auto auto;
+    justify-content: center;
+    gap: .6em 1em;
+    background-color: color-mix(in oklab, $brand-color 20%, #fff);
+    padding: $spacing-unit * .5;
+    align-items: center;
+    border-radius: 3px;
+
+    .email-form__icon {
+        width: 5em;
+        height: 5em;
+        --icon-stroke-color: #{$brand-color};
+        --icon-fill-color: rgba(255, 255, 255, .4);
+    }
 
-    .email-input {
-        margin-right: 0px;
+    .email-form__description {
+        max-width: 18em;
     }
 
-    .email-submit {
-        margin-left: 0px;
+    .email-form__input {
+        grid-column: 1 / 3;
     }
-}
\ No newline at end of file
+}
+
+.email-input {
+    display: grid;
+    grid-template-columns: repeat(2, auto);
+    gap: 5px;
+    
+    label {
+        grid-column: 1 / 3;
+        font-size: .8em;
+    }
+}
diff --git a/static/intro-icons.svg b/static/intro-icons.svg
index 1cdf37b2a..dbbbe1470 100644
--- a/static/intro-icons.svg
+++ b/static/intro-icons.svg
@@ -56,4 +56,20 @@
     <circle fill="none" stroke="#000000" stroke-width="2" stroke-miterlimit="10" cx="36" cy="17" r="10"/>
   </g>
 </symbol>
-</svg>
\ No newline at end of file
+
+<symbol id="incoming-envelope" viewBox="0 0 72 72">
+  <g id="color">
+    <rect x="27.5987" y="23.8185" rx="1.5627" width="37.5107" height="23.4538" fill="var(--icon-fill-color)"/>
+    <path fill="var(--icon-fill-color)" d="M65.1522,24.5967V44.5922a4.1748,4.1748,0,0,1-.3759,1.729L56.282,38.5034l-.7517.0751-3.082-2.8565Z"/>
+  </g>
+  <g id="line">
+    <line x1="5.7967" x2="22.1067" y1="41.904" y2="41.904" fill="none" stroke="var(--icon-stroke-color)" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"/>
+    <line x1="9.2917" x2="22.1067" y1="34.914" y2="34.914" fill="none" stroke="var(--icon-stroke-color)" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"/>
+    <path fill="none" stroke="var(--icon-stroke-color)" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M36.512,38.5785l-8.4192,7.7427a3.9028,3.9028,0,0,1-.451-1.729v-19.92"/>
+    <path fill="none" stroke="var(--icon-stroke-color)" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M57.5383,39.399,64.83,46.11a3.5861,3.5861,0,0,0,.3226-1.4841V24.5967"/>
+    <path fill="none" stroke="var(--icon-stroke-color)" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M55.4551,37.7517l9.2461,8.4943a1.6075,1.6075,0,0,1-1.3531.9772H29.3707a1.78,1.78,0,0,1-1.3531-.902l9.0957-8.344"/>
+    <path fill="none" stroke="var(--icon-stroke-color)" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M65.1522,24.5967l-12.0274,11.05-3.3827,3.1572c-.15.15-.3759.3006-.5262.451a4.6338,4.6338,0,0,1-5.7882,0c-.15-.15-.3758-.3007-.5262-.451L39.5188,35.722l-11.877-11.05c0-.0752.0751-.0752.0751-.15A1.5333,1.5333,0,0,1,28.92,23.77H63.8743a1.6558,1.6558,0,0,1,1.2027.6766C65.077,24.5215,65.1522,24.5215,65.1522,24.5967Z"/>
+  </g>
+</symbol>
+
+</svg>
diff --git a/templates/includes/email_signup.html b/templates/includes/email_signup.html
index c0f1ca1cf..66cd0797a 100644
--- a/templates/includes/email_signup.html
+++ b/templates/includes/email_signup.html
@@ -1,14 +1,21 @@
 <form action="https://gamedev.us22.list-manage.com/subscribe/post?u=3b2317bf9350c11e252162541&amp;id=aaf37783ec&amp;f_id=0011cde1f0" method="post" name="mc-embedded-subscribe-form">
     <div class="email-form">
-        <div class="email-input">
-            <label for="email-input">Email Address</label>
-            <input type="email" inputmode="email" name="EMAIL" id="email-input" required>
+        <svg class="email-form__icon" aria-hidden="true">
+            <svg><use xlink:href="{{ get_url(path='intro-icons.svg#incoming-envelope') }}"></use></svg>
+        </svg>
+
+        <div class="email-form__description">
+            Get the Rust GameDev Workgroup’s monthly newsletter delivered directly to your inbox.
         </div>
-        <div class="email-submit">
+
+        <div class="email-form__input email-input">
+            <label for="email-input">Email Address</label>
+            <input type="email" inputmode="email" name="EMAIL" id="email-input" placeholder="hello@example.com" required>
             <button type="submit" name="subscribe" class="btn">Subscribe</button>
-        </div>
-        <div style="position: absolute; left: -5000px;" aria-hidden="true">
-            <input type="text" name="b_3b2317bf9350c11e252162541_aaf37783ec" tabindex="-1" value="">
+
+            <div style="position: absolute; left: -5000px;" aria-hidden="true">
+                <input type="text" name="b_3b2317bf9350c11e252162541_aaf37783ec" tabindex="-1" value="">
+            </div>
         </div>
     </div>
 </form>