diff --git a/.idea/misc.xml b/.idea/misc.xml
index ea4e978..dc9ea49 100644
--- a/.idea/misc.xml
+++ b/.idea/misc.xml
@@ -1,4 +1,4 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <project version="4">
-  <component name="ProjectRootManager" version="2" project-jdk-name="Python 3.10 (pythonProject5)" project-jdk-type="Python SDK" />
+  <component name="ProjectRootManager" version="2" project-jdk-name="Python 3.10" project-jdk-type="Python SDK" />
 </project>
\ No newline at end of file
diff --git a/.idea/portfolio.iml b/.idea/portfolio.iml
index d0876a7..8437fe6 100644
--- a/.idea/portfolio.iml
+++ b/.idea/portfolio.iml
@@ -2,7 +2,7 @@
 <module type="PYTHON_MODULE" version="4">
   <component name="NewModuleRootManager">
     <content url="file://$MODULE_DIR$" />
-    <orderEntry type="inheritedJdk" />
+    <orderEntry type="jdk" jdkName="Python 3.10" jdkType="Python SDK" />
     <orderEntry type="sourceFolder" forTests="false" />
   </component>
 </module>
\ No newline at end of file
diff --git a/icons/github.png b/icons/github.png
new file mode 100644
index 0000000..95cdc93
Binary files /dev/null and b/icons/github.png differ
diff --git a/icons/instagram.png b/icons/instagram.png
new file mode 100644
index 0000000..9c0662c
Binary files /dev/null and b/icons/instagram.png differ
diff --git a/index.js b/index.js
new file mode 100644
index 0000000..0ee2f10
--- /dev/null
+++ b/index.js
@@ -0,0 +1,45 @@
+// Greeter
+function called() {
+    var time = new Date()
+    let timestamp = time.getHours()
+    console.log(timestamp)
+
+    var greting_user;
+    if (timestamp >= 0 && timestamp < 12){
+        greting_user = "Good Morning🤩";
+    }
+    else if (timestamp >=12 && timestamp < 19){
+        greting_user = "Good AfterNoon🥰"
+    }
+    else if (timestamp >=19 && timestamp < 24){
+        greting_user = "Good Evening😎"
+    }
+    else if (timestamp >=24){
+        greting_user = "Good Night😴"
+    }
+
+    document.getElementById("greetings").innerText = "Hello, "+greting_user
+}
+
+// text color changer
+function changColor(){
+    let list = ["red", "green", "yellow", "purple", "skyblue", "pink"]
+    let m = Math.random() * 5
+    console.log(parseInt(m))
+    document.getElementById("greetings").style.color = list[parseInt(m)]
+    document.getElementById("table").style.borderColor = list[parseInt(m)]
+    document.getElementById("greetme").style.color = list[parseInt(m)]
+    document.getElementById("changColor").style.color = list[parseInt(m)]
+    document.getElementById("changbackColor").style.color = list[parseInt(m)]
+    document.getElementById("about").style.color = list[parseInt(m)]
+}
+
+// background Color changer
+function changBackgroundColor(){
+    let list = ["red", "green", "yellow", "purple", "skyblue", "pink"]
+    let m = Math.random() * 5
+    console.log(parseInt(m))
+    // document.getElementById("bck").style.backgroundColor = list[parseInt(m)]
+    document.getElementById("bck").style.background = background(linear-gradient("-45deg, #ee9952, #e74c7e, #29a6d5, #66d5ab"))
+
+}
\ No newline at end of file
diff --git a/style.css b/style.css
new file mode 100644
index 0000000..6f9d199
--- /dev/null
+++ b/style.css
@@ -0,0 +1,18 @@
+body {
+	background: linear-gradient(-45deg, #e2c81f, #e20157, #23a6d5, #58e8c6);
+	background-size: 400% 400%;
+	animation: gradient 15s ease infinite;
+	height: 120vh;
+}
+
+@keyframes gradient {
+	0% {
+		background-position: 0% 50%;
+	}
+	50% {
+		background-position: 100% 50%;
+	}
+	100% {
+		background-position: 0% 50%;
+	}
+}