diff --git a/index.html b/index.html
index d4a1f419..9f624b65 100644
--- a/index.html
+++ b/index.html
@@ -35,6 +35,7 @@
+
diff --git a/script.js b/script.js
index bb941961..5e43c452 100644
--- a/script.js
+++ b/script.js
@@ -1,3 +1,39 @@
+const dots = [];
+const cursor = {
+ x: 0,
+ y: 0,
+};
+
+for (let i = 0; i < 10; i++) {
+ const dot = document.createElement("div");
+ dot.style.scale=`0.${10-(i)}`;
+ dot.className = "dot";
+ document.body.appendChild(dot);
+ dots.push(dot);
+}
+
+document.addEventListener("mousemove", (e) => {
+ cursor.x = e.clientX;
+ cursor.y = e.clientY;
+});
+
+function draw() {
+ let x = cursor.x;
+ let y = cursor.y;
+
+ dots.forEach((dot, index) => {
+ const nextDot = dots[index + 1] || dots[0];
+
+ dot.style.left = x + "px";
+ dot.style.top = y + "px";
+
+ x += (nextDot.offsetLeft - dot.offsetLeft) * 0.5;
+ y += (nextDot.offsetTop - dot.offsetTop) * 0.5;
+ });
+}
+
+setInterval(draw, 10);
+
document.getElementById("copyright-year").textContent =
new Date().getFullYear();
diff --git a/style.css b/style.css
index 930c9955..240ccb46 100644
--- a/style.css
+++ b/style.css
@@ -8,6 +8,7 @@
body{
background-color: black;
overflow-x: hidden;
+ cursor: none;
}
:root {
@@ -720,6 +721,18 @@ body{
cursor: pointer;
}
+/*custom cursor*/
+.dot {
+ width: 30px;
+ height: 30px;
+ background: rgb(194, 194, 194);
+ position: fixed;
+ border-radius: 50%;
+ pointer-events: none;
+ transform: translate(-50%, -50%);
+ z-index: 9999;
+}
+
/*Drop down*/
ul li ul.dropdown {
width: auto;
@@ -760,3 +773,4 @@ ul li ul.dropdown li a:hover {
}
/* Optional: styling for active links */
+