diff --git a/contact.html b/contact.html
index 0d3852a..fdcda6d 100644
--- a/contact.html
+++ b/contact.html
@@ -13,10 +13,13 @@
     <main>
         <h3 class="page-title">Kontakt</h3>
         <hr>
+        <div id="contact-form-container">
+        </div>
     </main>
 
     <div class="page-footer"></div>
 
+    <script src="./scripts/contact.js"></script>
     <script src="./scripts/main.js" defer></script>
 </body>
 </html>
\ No newline at end of file
diff --git a/login.html b/login.html
index f9dd8fb..eafce9b 100644
--- a/login.html
+++ b/login.html
@@ -14,14 +14,14 @@
         <div class="page-title-container">
             <h3 class="page-title" id="page-title">Prijava</h3>
         </div>
-        <form class="page-login-form" id="login-form">
+        <form class="contact-form" id="login-form">
             <div class="form-group">
                 <label for="username">Uporabniško ime:</label><br>
-                <input type="text" id="username" name="username" required>
+                <input type="text" id="username" name="username" class="page-input" required>
             </div>
             <div class="form-group">
                 <label for="password">Geslo:</label><br>
-                <input type="password" id="password" name="password" required>
+                <input type="password" id="password" name="password" class="page-input" required>
             </div>
             <div class="form-group">
                 <button type="submit" class="page-btn">Prijavi se</button>
diff --git a/register.html b/register.html
index 4b0af41..ce66ad9 100644
--- a/register.html
+++ b/register.html
@@ -14,22 +14,22 @@
         <div class="page-title-container">
             <h3 class="page-title" id="page-title">Registracija</h3>
         </div>
-        <form class="page-login-form" id="login-form">
+        <form class="contact-form" id="login-form">
             <div class="form-group">
                 <label for="username">Uporabniško ime:</label><br>
-                <input type="text" id="username" name="username" required>
+                <input type="text" id="username" name="username" class="page-input" required>
             </div>
             <div class="form-group">
                 <label for="email">E-pošta:</label><br>
-                <input type="email" id="email" name="email" required>
+                <input type="email" id="email" name="email" class="page-input" required>
             </div>
             <div class="form-group">
                 <label for="password">Geslo:</label><br>
-                <input type="password" id="password" name="password" required>
+                <input type="password" id="password" name="password" class="page-input" required>
             </div>
             <div class="form-group">
                 <label for="confirm-password">Potrdite geslo:</label><br>
-                <input type="password" id="confirm-password" name="confirm-password" required>
+                <input type="password" id="confirm-password" name="confirm-password" class="page-input" required>
             </div>
             <div class="form-group">
                 <button type="submit" class="page-btn">Registriraj se</button>
diff --git a/scripts/contact.js b/scripts/contact.js
new file mode 100644
index 0000000..d982306
--- /dev/null
+++ b/scripts/contact.js
@@ -0,0 +1,49 @@
+const form = `
+<form class="contact-form" id="contact-form">
+    <label for="message">Sporočilo:</label>
+    <textarea id="message" name="message" rows="5" class="page-input" required></textarea>
+    <button type="submit" class="page-btn">Pošlji</button>
+    <p>Vaše sporočilo bo vezano na vaš račun, zato vam bomo lahko odgovorili na e-pošto, ki ste jo vnesli ob registraciji.</p>
+</form>`;
+
+document.addEventListener("DOMContentLoaded", () => {
+    const contactFormContainer = document.getElementById("contact-form-container");
+    // Najdi cookie "token" v cookies
+    const isLoggedIn = document.cookie.split(";").some(cookie => cookie.trim().startsWith("token="));
+    if (contactFormContainer && isLoggedIn) {
+        contactFormContainer.innerHTML = form;
+
+        document.getElementById("contact-form").addEventListener("submit", (e) => {
+            e.preventDefault();
+
+            const url = "http://localhost:3000/kontakt";
+            const message = document.getElementById("message").value;
+            fetch(url, {
+                method: "POST",
+                headers: {
+                    "Content-Type": "application/json"
+                },
+                body: JSON.stringify({ "token": document.cookie.split(";").find(cookie => cookie.trim().startsWith("token=")).split("=")[1], "message": message })
+            })
+            .then(response => {
+                if (!response.ok) {
+                    throw new Error("Network response was not ok");
+                }
+                return response.json();
+            })
+            .then(data => {
+                console.log("Success:", data);
+                document.getElementById("contact-form").innerHTML = `<p class="page-paragraph-success">Hvala za vaše sporočilo! Odgovorili vam bomo v najkrajšem možnem času.</p>`;
+            })
+            .catch((error) => {
+                console.error("Error:", error);
+                document.getElementById("contact-form").innerHTML = `<p class="page-paragraph-error">Prišlo je do napake pri pošiljanju vašega sporočila. Prosimo, poskusite znova pozneje.</p>`;
+            });
+
+            // TODO: Popravi margin pri success in error textu da ne bo offsetan
+
+        });
+    } else if (contactFormContainer) {
+        contactFormContainer.innerHTML = `<p class="page-paragraph">Za pošiljanje sporočila se morate prijaviti.</p>`;
+    }
+});
\ No newline at end of file
diff --git a/styles/main.css b/styles/main.css
index bcc4ac6..ac2ae34 100644
--- a/styles/main.css
+++ b/styles/main.css
@@ -296,6 +296,22 @@ nav {
     outline: none;
 }
 
+.contact-form {
+    display: flex;
+    flex-direction: column;
+    gap: 12px;
+    padding: 20px;
+    border: 1px solid var(--nav-btn-border);
+    border-radius: 8px;
+    background: var(--nav-btn-bg);
+    color: var(--text-color);
+    transition: background-color 0.25s ease, border-color 0.25s ease, color 0.25s ease;
+    max-width: max(max-content, 400px);
+    margin: 20px auto;
+    margin-left: 23px;
+    margin-right: 23px;
+}
+
 @media (max-width: 720px) {
     header {
         padding: 6px 8px;