diff --git a/client/src/components/ui/TextInput/text-input.scss b/client/src/components/ui/TextInput/text-input.scss
index d59a19a591525fbfda37be50497f0131609e46d5..d067bd80cc110c6896fb3076ab9fdfe257aedf57 100644
--- a/client/src/components/ui/TextInput/text-input.scss
+++ b/client/src/components/ui/TextInput/text-input.scss
@@ -1,3 +1,6 @@
+@use 'styles/settings.scss' as s;
+@use 'styles/mixins.scss' as mx;
+
 .input-field {
     position: relative;
     margin: 20px 0 30px 0;
@@ -28,7 +31,7 @@
         font-size: 16px;
         position: absolute;
         left: 20px;
-        font-weight: var(--weight-bold);
+        font-weight: s.$weight-bold;
         z-index: 20;
         transform: translateY(-50%);
 
@@ -36,6 +39,7 @@
 
     textarea {
         resize: none;
+        height: 300px;
     }
 
     input,
@@ -50,8 +54,8 @@
         display: block;
         border-radius: 15px;
         color: #fff;
-        font-weight: var(--weight-regular);
-        font-family: 'Poppins', sans-serif;
+        font-weight: s.$weight-regular;
+        font-family: s.$body-font;
         background: rgba(255, 255, 255, 0.1);
     }
 }
diff --git a/client/src/index.scss b/client/src/index.scss
index bb88d8b95a60c942e07b6cd3c9ebdc03bc44dd13..cad66de163080c8c7e62e82e107954485411bf4f 100644
--- a/client/src/index.scss
+++ b/client/src/index.scss
@@ -20,7 +20,7 @@ body {
     position: relative;
     background: linear-gradient(to left, #e2e2e2 0%, #e6e6e6 100%);
 
-    @include mx.breakpoint(large) {
+    @include mx.breakpoint(xlarge) {
         padding: 5rem 0;
     }
 }
diff --git a/client/src/pages/Home/home.scss b/client/src/pages/Home/home.scss
index 2adbbc1d15acbf80f0ad6cc262f6ad7ef0617df4..e085d9c9c866af811a19cd6edf76a608564616a4 100644
--- a/client/src/pages/Home/home.scss
+++ b/client/src/pages/Home/home.scss
@@ -69,7 +69,7 @@ header {
             height: calc(100vh - 0.5rem);
         }
 
-        @include mx.breakpoint(large) {
+        @include mx.breakpoint(xlarge) {
             height: calc(100vh - 6rem);
         }
 
diff --git a/client/src/pages/Home/index.tsx b/client/src/pages/Home/index.tsx
index 44b71d2382a5741d915b76d9c55322a7bff51c7d..758eeef51805e237179338556a535a16f3e44cc6 100644
--- a/client/src/pages/Home/index.tsx
+++ b/client/src/pages/Home/index.tsx
@@ -1,6 +1,7 @@
 import Project from 'components/ui/Project';
 import ButtonLink from 'components/ui/ButtonLink';
 import Button from 'components/ui/Button';
+import TextInput from 'components/ui/TextInput';
 import './home.scss';
 
 import Logo from 'images/logo.svg';
@@ -149,6 +150,11 @@ export default function Home() {
                             to help you resolve the issue.
                     </p>
                         <form className="contact-form" action="mailto:dplanoetscher@unibz.it" method="GET">
+                            <TextInput label="Fistname" name="firstname" />
+                            <TextInput label="Lastname" name="lastname" />
+                            <TextInput label="Email" name="email" type="email" />
+                            <TextInput label="Subject" name="subject" />
+                            <TextInput label="Message" name="message" type="textarea" />
                             <div className="button-container">
                                 <Button type="submit">Send</Button>
                             </div>