diff --git a/web/src/pages/Home/Home.jsx b/web/src/pages/Home/Home.jsx
new file mode 100644
index 00000000..74c69e3a
--- /dev/null
+++ b/web/src/pages/Home/Home.jsx
@@ -0,0 +1,40 @@
+import InterfaceImage from "@/common/assets/interface.png";
+import Logo from "@/common/assets/logo192.png";
+import "./styles.sass";
+import {FontAwesomeIcon} from "@fortawesome/react-fontawesome";
+import {faArrowDown, faArrowUp} from "@fortawesome/free-solid-svg-icons";
+import Features from "@/pages/Home/components/Features";
+
+const COLORS = ["#45C65A", "#E58A00", "#EC5555"];
+
+const chooseRandomColor = () => COLORS[Math.floor(Math.random() * COLORS.length)];
+
+export const Home = () => {
+    return (
+        <div className="home-page">
+
+            <div className="info-area">
+                <img src={Logo} alt="Logo"/>
+                <div className="title-area">
+                    <h1>MySpeed</h1>
+                    <h2>Speedtest automation made simple</h2>
+
+                </div>
+            </div>
+
+            {Array(5).fill(0).map((_, index) => (
+                <div className="flying-icons" key={index}>
+                    <FontAwesomeIcon icon={faArrowDown} style={{color: chooseRandomColor(),animationDelay: `${index * 0.5}s`}}/>
+                    <FontAwesomeIcon icon={faArrowUp} style={{color: chooseRandomColor(),animationDelay: `${index * 0.5}s`}}/>
+                </div>
+            ))}
+
+
+            <div className="interface-image">
+                <img src={InterfaceImage} alt="Interface"/>
+            </div>
+
+            <Features />
+        </div>
+    )
+}
\ No newline at end of file