diff --git a/frontend/src/components/auth/index.jsx b/frontend/src/components/auth/index.jsx
index 4214a7f..a7b1f8b 100644
--- a/frontend/src/components/auth/index.jsx
+++ b/frontend/src/components/auth/index.jsx
@@ -1,6 +1,7 @@
 /* eslint-disable react/react-in-jsx-scope */
 import { Button, Card, TextInput, Avatar } from "flowbite-react";
 import { useState } from "react";
+import { useNavigate } from "react-router-dom";
 
 export default function Login() {
 	const [data, setData] = useState({
@@ -8,6 +9,11 @@ export default function Login() {
 		password: "",
 	});
 
+	const navigate = useNavigate();
+	const handleNavigation = () => {
+		navigate("/signup");
+	};
+
 	const onChange = (e) => {
 		setData({ ...data, [e.target.id]: e.target.value });
 	};
@@ -41,7 +47,9 @@ export default function Login() {
 						<Button type="submit" style={{ backgroundColor: "green" }}>
 							Sign In
 						</Button>
-						<Button type="submit">Create Account</Button>
+						<Button type="button" onClick={handleNavigation}>
+							Create Account
+						</Button>
 					</form>
 				</Card>
 			</center>
diff --git a/frontend/src/components/registration/index.jsx b/frontend/src/components/registration/index.jsx
index 793cd37..d0d9a58 100644
--- a/frontend/src/components/registration/index.jsx
+++ b/frontend/src/components/registration/index.jsx
@@ -2,6 +2,7 @@
 import { Button, Card, TextInput, Avatar } from "flowbite-react";
 import { useState } from "react";
 import axios from "axios";
+import { useNavigate } from "react-router-dom";
 
 export default function Registration() {
 	const [data, setData] = useState({
@@ -12,6 +13,8 @@ export default function Registration() {
 		username: "",
 	});
 
+	const navigate = useNavigate();
+
 	const onChange = (e) => {
 		setData({ ...data, [e.target.id]: e.target.value });
 	};
@@ -28,7 +31,8 @@ export default function Registration() {
 		axios
 			.post("http://localhost:8000/api/signup", data)
 			.then(() => {
-				alert("Successfully signed up");
+				alert("Success");
+				navigate("/users");
 			})
 			.catch(() => {
 				alert("Failed to submit");
@@ -36,7 +40,7 @@ export default function Registration() {
 	};
 
 	return (
-		<center style={{ marginTop: "250px" }}>
+		<center style={{ marginTop: "5vh" }}>
 			<Card className="max-w-md">
 				<Avatar img="/user.png" rounded size="xl" />
 				<h3 className="text-center text-xl mb-4 mt-4">Welcome to Chit-Chat</h3>