diff --git a/src/Components/error404.jsx b/src/Components/error404.jsx
index 3cd321d7..08df0c75 100644
--- a/src/Components/error404.jsx
+++ b/src/Components/error404.jsx
@@ -1,26 +1,25 @@
 import React from "react";
-import error from "../img/error.png";
-import Footer from "./Footer"
 import { Link } from "react-router-dom";
+import { Helmet } from "react-helmet";
 
 function Error404() {
     return (
         <>
-            <section className="error">
-                <div className="error-container">
-                    <div className="error-img">
-                        <img src={error} alt="error-vector" />
-                    </div>
-                    <div className="error-text-field">
-                        <h1>404</h1>
-                        <span>Looks like you are lost</span>
-                        <span>The page you are looking for could not be found</span>
-                        <Link to={'/'}>Homepage</Link>
-                    </div>
+            <Helmet>
+                <title>Error 404 could not find the page</title>
+            </Helmet>
+            <section className="error-page">
+                <div className="error-background">
+                    <h1>404</h1>
+                </div>
+                <div className="error-texts">
+                    <span className="top-error-heading">Welcome to <span>the 404 dimension</span></span>
+                    <h1 className="error-description">You have discovered a new dimension</h1>
+                    <span className="bottom-error-heading">But unfortunately, this dimension has nothing at all</span>
+                    <button>Go back to the old dimension</button>
                 </div>
             </section>
-            <Footer />
         </>
     )
 }
-export default Error404;
\ No newline at end of file
+export default Error404;