diff --git a/Pomodoro Timer/index.html b/Pomodoro Timer/index.html
new file mode 100644
index 0000000..12726ba
--- /dev/null
+++ b/Pomodoro Timer/index.html
@@ -0,0 +1,30 @@
+
+
+
+
+
+
+
+ Pomodoro Timer
+
+
+
+
+
+ Pomodoro Timer
+
+
+ 25:00
+
+
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/Pomodoro Timer/script.js b/Pomodoro Timer/script.js
new file mode 100644
index 0000000..78f0b6b
--- /dev/null
+++ b/Pomodoro Timer/script.js
@@ -0,0 +1,42 @@
+const start = document.getElementById('start');
+const stop = document.getElementById('stop');
+const reset = document.getElementById('reset');
+const timer = document.getElementById('timer');
+
+
+let interval;
+
+let timeLeft = 1500;
+
+function update(){
+ let minutes = Math.floor(timeLeft / 60);
+ let seconds = timeLeft % 60 ;
+ let formattedTime =` ${minutes} : ${seconds}`;
+
+ timer.innerHTML = formattedTime;
+}
+
+function startTimer(){
+ interval = setInterval(() => {
+ timeLeft--;
+ update();
+ if(timeLeft === 0){
+ alert('Times Up');
+ timeLeft = 1500;
+ }
+ }, 1000);
+}
+
+
+function stopTimer(){
+ clearInterval(interval);
+}
+function resetTimer(){
+ clearInterval(interval);
+ timeLeft = 1500;
+ update();
+}
+
+start.addEventListener('click', startTimer);
+stop.addEventListener('click', stopTimer);
+reset.addEventListener('click', resetTimer);
\ No newline at end of file
diff --git a/Pomodoro Timer/style.css b/Pomodoro Timer/style.css
new file mode 100644
index 0000000..5f4e609
--- /dev/null
+++ b/Pomodoro Timer/style.css
@@ -0,0 +1,52 @@
+.container{
+ margin: 0 auto;
+ max-width: 400px;
+ text-align: center;
+ padding: 20px;
+ font-family: "Roboto",sans-serif;
+ background-color: #f5f5f5;
+ margin-top:120px;
+}
+
+.title{
+ font-size: 36px;
+ margin-bottom: 10px;
+ color: #2c3e50;
+}
+
+.timer{
+ font-size: 72px;
+ color: #2c3e50;
+}
+
+button{
+ font-size: 18px;
+ padding:10px 20px;
+ margin: 10px;
+ color: #fff;
+ border: none;
+ border-radius: 4px;
+ cursor: pointer;
+ text-transform: uppercase;
+ transition: opacity .3s ease-in-out;
+}
+
+button:hover{
+ opacity: 70%;
+}
+
+#start{
+ background-color: #37ae60;
+}
+
+#stop{
+ background-color: #c0392b;
+}
+
+#reset{
+ background-color: #7f8c8d;
+}
+
+
+
+
diff --git a/assets/images/pomodoro-timer.png b/assets/images/pomodoro-timer.png
new file mode 100644
index 0000000..7e8ac5a
Binary files /dev/null and b/assets/images/pomodoro-timer.png differ
diff --git a/projects.js b/projects.js
index bfc3324..96fd7bc 100644
--- a/projects.js
+++ b/projects.js
@@ -165,4 +165,11 @@ window.totalProjects = [
preview: "https://alsiam.github.io/web-projects/todo-list",
code: "https://github.com/alsiam/web-projects/tree/main/todo-list",
},
+ {
+ id: 20,
+ name: "Pomodoro Timer",
+ thumbnail: "assets/images/pomodoro-timer.png",
+ preview: "https://alsiam.github.io/web-projects/pomodoro-timer",
+ code: "https://github.com/alsiam/web-projects/tree/main/pomodoro-timer",
+ },
];