diff --git a/Animate/beatingHeart.html b/Animate/beatingHeart.html
new file mode 100644
index 0000000..277870b
--- /dev/null
+++ b/Animate/beatingHeart.html
@@ -0,0 +1,57 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+    <title> beatingHeart | Animate</title>
+    <style>
+
+         
+
+        #beatingHeart {
+            margin-top: 20%;
+            margin-left: 20%;
+            width: 300px;
+            height: 200px;
+            position: relative;
+            text-align: center;
+            font-size: 60px;
+            color: red;
+           
+           
+            animation: beatingHeart 2s;
+            -webkit-animation-iteration-count: infinite;
+            animation-iteration-count: infinite;
+            animation-timing-function:linear;
+            animation-duration: 0.8s;
+        }
+
+        #beatingHeart::after {
+            content: "\2665";
+        }
+
+       
+       
+        @keyframes beatingHeart {
+              0% {
+                transform: scale(1);
+                opacity: 1;
+            }
+
+            
+            35% {
+                transform: scale(1.4);
+                opacity: 1;
+            }
+            
+            100% {
+                transform: scale(1);
+            }
+        }
+    </style>
+</head>
+
+<body>
+    <div id="beatingHeart"></div>
+</body>
+
+</html>
\ No newline at end of file
diff --git a/Animate/rotate360.html b/Animate/rotate360.html
new file mode 100644
index 0000000..852202d
--- /dev/null
+++ b/Animate/rotate360.html
@@ -0,0 +1,49 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+    <title> rotate360 | Animate</title>
+    <style>
+
+         
+
+        #rotate360 {
+            margin-top: 20%;
+            margin-left: 20%;
+            width: 300px;
+            height: 200px;
+            position: relative;
+            text-align: center;
+           
+           
+            animation: rotate360 2s;
+            -webkit-animation-iteration-count: infinite;
+            animation-iteration-count: infinite;
+            animation-timing-function:linear;
+            animation-duration: 8s;
+        }
+
+        #rotate360::after {
+            content: "Am I a tangent or tangents? Who am I?" ;
+        }
+
+       
+       
+        @keyframes rotate360 {
+            0% {
+                transform: rotate(0deg);
+                opacity: 1;
+            }
+            
+            100% {
+                transform: rotate(360deg);
+            }
+        }
+    </style>
+</head>
+
+<body>
+    <div id="rotate360"></div>
+</body>
+
+</html>
\ No newline at end of file
diff --git a/Animate/zoomIn.html b/Animate/zoomIn.html
new file mode 100644
index 0000000..9e7083a
--- /dev/null
+++ b/Animate/zoomIn.html
@@ -0,0 +1,46 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+    <title> zoomIn | Animate</title>
+    <style>
+
+         
+
+        #zoomIn {
+            width: 200px;
+            height: 200px;
+            position: relative;
+            color: grey;
+            animation: zoomIn 2s;
+            -webkit-animation-iteration-count: infinite;
+            animation-iteration-count: infinite;
+        }
+
+        #zoomIn::after {
+            content: "The quick brown fox jumps over the lazy dog" ;
+        }
+
+       
+       
+        @keyframes zoomIn {
+            0% {
+                transform: scale(0.2);
+                opacity: 0;
+            }
+            60% {
+                transform: scale(1.4);
+                opacity: 1;
+            }
+            100% {
+                transform: scale(1);
+            }
+        }
+    </style>
+</head>
+
+<body>
+    <div id="zoomIn"></div>
+</body>
+
+</html>
\ No newline at end of file
diff --git a/Animate/zoomOut.html b/Animate/zoomOut.html
new file mode 100644
index 0000000..99e8db3
--- /dev/null
+++ b/Animate/zoomOut.html
@@ -0,0 +1,43 @@
+<!DOCTYPE html>
+<html>
+
+<head>
+    <title> zoomOut | Animate</title>
+    <style>
+        #zoomOut {
+            width: 100px;
+            height: 80px;
+            position: relative;
+            text-align: center;
+            color: grey;
+            animation: zoomOut 2s;
+            -webkit-animation-iteration-count: infinite;
+            animation-iteration-count: infinite;
+        }
+
+        #zoomOut::after {
+            content: "May the Source be with you" ;
+        }
+       
+        @keyframes zoomOut {
+            0% {
+                transform: scale(1.6);
+                opacity: 0.5;
+            }
+            50% {
+                transform: scale(1);
+                opacity: 1;
+            }
+            100% {
+                transform: scale(0.2);
+                opacity: 0;
+            }
+        }
+    </style>
+</head>
+
+<body>
+    <div id="zoomOut"></div>
+</body>
+
+</html>
\ No newline at end of file
diff --git a/Assets/beatingHeart.gif b/Assets/beatingHeart.gif
new file mode 100644
index 0000000..a77b53e
Binary files /dev/null and b/Assets/beatingHeart.gif differ
diff --git a/Assets/rotate360.gif b/Assets/rotate360.gif
new file mode 100644
index 0000000..c871a18
Binary files /dev/null and b/Assets/rotate360.gif differ
diff --git a/Assets/zoomIn.gif b/Assets/zoomIn.gif
new file mode 100644
index 0000000..ed7c332
Binary files /dev/null and b/Assets/zoomIn.gif differ
diff --git a/Assets/zoomOut.gif b/Assets/zoomOut.gif
new file mode 100644
index 0000000..896f1ac
Binary files /dev/null and b/Assets/zoomOut.gif differ
diff --git a/README.md b/README.md
index 4eee6f9..95e00d4 100644
--- a/README.md
+++ b/README.md
@@ -51,5 +51,14 @@ One `<div>`. Many possibilities.
 | [United Kingdom](https://github.com/ManrajGrover/SingleDivProject/blob/master/Flags/UK.html) | [jdhoek](https://github.com/jdhoek) | ![United Kingdom](https://github.com/ManrajGrover/SingleDivProject/blob/master/Assets/UK.png) |
 | [United States of America](https://github.com/ManrajGrover/SingleDivProject/blob/master/Flags/USA.html) | [jdhoek](https://github.com/jdhoek) | ![United States of America](https://github.com/ManrajGrover/SingleDivProject/blob/master/Assets/USA.png) |
 
+### Animate
+
+| Project Name | Your Name / Github Handle | Demo/Gif |
+| :---: | :---: | :---: |
+| [Zoom In](https://github.com/ManrajGrover/SingleDivProject/blob/master/Animate/zoomIn.html) | [netham91](https://github.com/netham91) | ![Zoom In](https://raw.githubusercontent.com/ManrajGrover/SingleDivProject/master/Assets/zoomIn.gif) |
+| [Zoom Out](https://github.com/ManrajGrover/SingleDivProject/blob/master/Animate/zoomOut.html) | [netham91](https://github.com/netham91) | ![Zoom In](https://raw.githubusercontent.com/ManrajGrover/SingleDivProject/master/Assets/zoomOut.gif) |
+| [Rotate 360](https://github.com/ManrajGrover/SingleDivProject/blob/master/Animate/rotate360.html) | [netham91](https://github.com/netham91) | ![Zoom In](https://raw.githubusercontent.com/ManrajGrover/SingleDivProject/master/Assets/rotate360.gif) |
+| [Beating Heart (ASCII)](https://github.com/ManrajGrover/SingleDivProject/blob/master/Animate/beatingHeart.html) | [netham91](https://github.com/netham91) | ![Zoom In](https://raw.githubusercontent.com/ManrajGrover/SingleDivProject/master/Assets/beatingHeart.gif) |
+
 ## License
 [MIT](https://github.com/ManrajGrover/SingleDivProject/blob/master/LICENSE).
