diff --git a/JS/Tasks List/index.html b/JS/Tasks List/index.html
new file mode 100644
index 00000000..4f6cf89f
--- /dev/null
+++ b/JS/Tasks List/index.html
@@ -0,0 +1,24 @@
+
+
+
+
+
+
+
+ Task Viewer
+
+
+
+ Task
+
+
+
+
+
+
\ No newline at end of file
diff --git a/JS/Tasks List/index.js b/JS/Tasks List/index.js
new file mode 100644
index 00000000..03879536
--- /dev/null
+++ b/JS/Tasks List/index.js
@@ -0,0 +1,20 @@
+var inputField = document.getElementById('inputField')
+var addToDo = document.getElementById('addToDo')
+var toDoContainer = document.getElementById('toDoContainer')
+
+addToDo.addEventListener('click',function(){
+ var data = inputField.value
+ var paragraph = document.createElement('p')
+ paragraph.innerText = data
+ paragraph.classList.add('paragraph-styling')
+ toDoContainer.append(paragraph)
+ inputField.value = ''
+
+ paragraph.addEventListener('click', function(){
+ paragraph.style.textDecoration = "line-through"
+ })
+
+ paragraph.addEventListener('dblclick', function(){
+ toDoContainer.removeChild(paragraph)
+ })
+})
\ No newline at end of file
diff --git a/JS/Tasks List/style.css b/JS/Tasks List/style.css
new file mode 100644
index 00000000..ee2ce5a5
--- /dev/null
+++ b/JS/Tasks List/style.css
@@ -0,0 +1,57 @@
+html, body{
+ width: 50%;
+ margin: 0 auto;
+ background-color: #0a192f;
+ color: white;
+ font-family: Arial, Helvetica, sans-serif;
+}
+
+.container{
+ width: 400px;
+}
+
+#inputField{
+ width: 300px;
+ height: 46px;
+ border-width: 0;
+ font-size: 1.4rem;
+ vertical-align: middle;
+
+ border: 2px solid rgba(77, 181, 255, 0.4);
+ outline: none;
+ background-color: transparent;
+ border-radius: 0.5rem;
+ color: white;
+ padding-left: 1rem;
+}
+
+#addToDo{
+ width: 50px;
+ height: 50px;
+ margin-left: 8px;
+ border-radius: 0.5rem;
+ vertical-align: middle;
+ font-size: 30px;
+ cursor: pointer;
+ border: 2px solid rgba(77, 181, 255, 0.4);
+ background-color: transparent;
+ color: white;
+}
+.paragraph-styling{
+ margin: 10;
+ cursor: pointer;
+ font-size: 20px;
+ background-color: #64ffda;
+ border-radius: 0.4rem;
+ color: black;
+ padding: 1.1rem;
+ transition: all 0.5s ease;
+}
+
+.paragraph-styling:hover{
+ transform: scale(1.05);
+}
+
+.to-dos{
+ margin-top: 25px;
+}
\ No newline at end of file