diff --git a/templates/index.html b/templates/index.html
index 2982155..5f1c631 100644
--- a/templates/index.html
+++ b/templates/index.html
@@ -18,17 +18,24 @@
     <div class="main-container">
         <div class="content">
             <h1> This is an input </h1>
-            <div class="row" style="display: flex;">
-                <div class="column" style="flex: 50%;">
+            <div class="row">
+                <div class="column">
+                    <div style="display: flex; justify-content: space-between;">
+                        <span class="input_label">Subject:</span>
+                        <input name="subject" type="text" id="subject">
+                    </div><br>
                     <textarea name="email_input" id="typebox" rows="32" cols="64" style="resize: none;"
                         hx-trigger="keyup changed delay:1000ms" hx-post="/mail-content" hx-target="#email-preview"
                         placeholder="Type out your email here..."></textarea>
                 </div>
 
-                <div class=" column" id="email-preview" style="flex: 50%;"></div>
+                <div class="column">
+                    <div id="subject-preview">Subject preview here</div><br>
+                    <div id="email-preview"></div>
+                </div>
             </div>
 
-            <div class="row" style="display: flex; align-items: center; justify-content: space-between;">
+            <div class="row" style="align-items: center; justify-content: space-between;">
                 <div class="column">
                     <h1>Current Mailing List Subscribers</h1>
                 </div>