diff --git a/Color-Flipper/index.html b/Color-Flipper/index.html
new file mode 100644
index 0000000..18a38e6
--- /dev/null
+++ b/Color-Flipper/index.html
@@ -0,0 +1,18 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/Countdown-timer/script.js b/Countdown-timer/script.js
new file mode 100644
index 0000000..1470b56
--- /dev/null
+++ b/Countdown-timer/script.js
@@ -0,0 +1,59 @@
+const startTimerButtonElement = document.getElementById('startTimer');
+const hoursInputElement = document.getElementById('hoursInput');
+const minutesInputElement = document.getElementById('minutesInput');
+const secondsInputElement = document.getElementById('secondsInput');
+
+const hoursOutputElement = document.getElementById('hoursOutput');
+const minutesOutputElement = document.getElementById('minutesOutput');
+const secondsOutputElement = document.getElementById('secondsOutput');
+
+let targetTime;
+let timerInterval;
+
+
+const updateTimer = () => {
+ if (targetTime) {
+ const differenceInSeconds = Math.floor(targetTime - Date.now()) / 1000;
+ if (differenceInSeconds < 1) {
+ clearInterval(timerInterval);
+ }
+
+ const hours = Math.floor(differenceInSeconds / 3600);
+ const minutes = Math.floor(differenceInSeconds / 60) % 60;
+ const seconds = Math.floor(differenceInSeconds % 60);
+
+ hoursOutputElement.textContent = `${hours} hours`;
+ minutesOutputElement.textContent = `${minutes} minutes`;
+ secondsOutputElement.textContent = `${seconds} seconds`;
+ }
+}
+
+startTimerButtonElement.addEventListener('click', () => {
+ clearInterval(timerInterval);
+ const futureHours = parseInt(hoursInputElement.value);
+ const futureMinutes = parseInt(minutesInputElement.value);
+ const futureSeconds = parseInt(secondsInputElement.value);
+
+ const date = new Date();
+ const currentHours = date.getHours();
+ const currentMinutes = date.getMinutes();
+ const currentSeconds = date.getSeconds();
+
+ date.setHours(currentHours + futureHours);
+ date.setMinutes(futureMinutes + currentMinutes);
+ date.setSeconds(currentSeconds + futureSeconds);
+
+ targetTime = date.getTime();
+ localStorage.setItem('targetTime', targetTime);
+ updateTimer();
+ timerInterval = setInterval(updateTimer, 500);
+});
+
+
+const storedTargetTime = localStorage.getItem('targetTime');
+
+if (storedTargetTime) {
+ targetTime = storedTargetTime;
+ updateTimer();
+ timerInterval = setInterval(updateTimer, 500);
+}
\ No newline at end of file
diff --git a/Countdown-timer/styles.css b/Countdown-timer/styles.css
new file mode 100644
index 0000000..b66dc91
--- /dev/null
+++ b/Countdown-timer/styles.css
@@ -0,0 +1,44 @@
+html, body{
+ height: 100%;
+}
+body{
+ font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
+ margin: 2rem;
+ background-image: url(timer-bg.jpg)
+}
+h1{
+ color: whitesmoke;
+}
+.container{
+ display: flex;
+ gap: 2rem;
+ box-shadow:0 0 24px 8px rgba(0,0,0,0.2);
+ padding: 1rem;
+ border-radius:.5rem;
+ background-color: whitesmoke;
+}
+.inputs{
+ display: flex;
+ flex-direction: column;
+ gap: .5rem;
+ width: 100px;
+}
+.inputs input{
+ padding: .5rem;
+}
+.inputs button{
+ border: 0;
+ padding: .5rem 1rem;
+ background-color:lightgray ;
+ cursor: pointer;
+}
+.inputs button:hover{
+ background-color: white;
+}
+.timer{
+ width: 100%;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ font-size: 2rem;
+}
\ No newline at end of file
diff --git a/Countdown-timer/timer-bg.jpg b/Countdown-timer/timer-bg.jpg
new file mode 100644
index 0000000..fd104e5
Binary files /dev/null and b/Countdown-timer/timer-bg.jpg differ
diff --git a/Hello-World/index.html b/Hello-World/index.html
new file mode 100644
index 0000000..8c1bd1b
--- /dev/null
+++ b/Hello-World/index.html
@@ -0,0 +1,15 @@
+
+
+
+
+
+
+
+
Document
+
+
Hello World
+
+
+
+
+
\ No newline at end of file
diff --git a/Hello-World/script.js b/Hello-World/script.js
new file mode 100644
index 0000000..3b592d3
--- /dev/null
+++ b/Hello-World/script.js
@@ -0,0 +1,7 @@
+const btnelement = document.querySelector('button')
+const spanElement = document.querySelector('span')
+
+btnelement.addEventListener('click', ()=>{
+ const result = prompt('Enter your name')
+ spanElement.textContent = result
+})
\ No newline at end of file
diff --git a/Hello-World/styles.css b/Hello-World/styles.css
new file mode 100644
index 0000000..c17a1ab
--- /dev/null
+++ b/Hello-World/styles.css
@@ -0,0 +1,28 @@
+h1{
+ font-size: 100px;
+ padding: 10px 10px;
+ font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
+}
+span{
+ color: blue;
+}
+.btn{
+ width: 200px;
+ height: 50px;
+ font-weight: bold;
+ font-size: 25px;
+ background-color: aquamarine;
+ font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
+ margin-left: 15px;
+ cursor: pointer;
+ border-radius: 3px;
+ box-shadow: 0px 0px 20px 0px rgb(154, 149, 149);
+}
+body{
+ margin-left:500px;
+
+}
+.btn:hover{
+ background-color: rgb(79, 245, 189);
+ transition: 0.2s ease;
+}
\ No newline at end of file