diff --git a/Art/loading/index.html b/Art/loading/index.html
new file mode 100644
index 000000000..a941976d6
--- /dev/null
+++ b/Art/loading/index.html
@@ -0,0 +1,20 @@
+
+
+
+
+
+ loading
+
+
+
+
+ - L
+ - O
+ - A
+ - D
+ - I
+ - N
+ - G
+
+
+
\ No newline at end of file
diff --git a/Art/loading/loading.gif b/Art/loading/loading.gif
new file mode 100644
index 000000000..5138efdb4
Binary files /dev/null and b/Art/loading/loading.gif differ
diff --git a/Art/loading/style.css b/Art/loading/style.css
new file mode 100644
index 000000000..7f4b06b8f
--- /dev/null
+++ b/Art/loading/style.css
@@ -0,0 +1,68 @@
+body{
+ margin: 0;
+ padding: 0;
+ background: #262626;
+}
+ul{
+ position: absolute;
+ top: 50%;
+ left: 50%;
+ transform: translate(-50%, -50%);
+ margin: 0;
+ padding: 0;
+ display: flex;
+}
+ul li{
+ list-style: none;
+ color: #484848;
+ font-family: arial;
+ font-size: 5em;
+ letter-spacing: 15px;
+ animation: animate 1.4s linear infinite;
+}
+@keyframes animate
+{
+ 0%
+ {
+ color: #484848;
+ text-shadow: none;
+ }
+ 90%
+ {
+ color: #484848;
+ text-shadow: none;
+ }
+ 100%
+ {
+ color: #fff900;
+ text-shadow: 0 0 7px #fff900, 0 0 50px #fff6c00;
+ }
+}
+ul li:nth-child(1)
+{
+ animation-delay: .2s;
+}
+ul li:nth-child(2)
+{
+ animation-delay: .4s;
+}
+ul li:nth-child(3)
+{
+ animation-delay: .6s;
+}
+ul li:nth-child(4)
+{
+ animation-delay: .8s;
+}
+ul li:nth-child(5)
+{
+ animation-delay: 1s;
+}
+ul li:nth-child(6)
+{
+ animation-delay: 1.2s;
+}
+ul li:nth-child(7)
+{
+ animation-delay: 1.4s;
+}
\ No newline at end of file
diff --git a/include.js b/include.js
index 5fec8e863..2cf071ba0 100644
--- a/include.js
+++ b/include.js
@@ -2903,6 +2903,13 @@ let cards = [
author: 'Kalliran',
githubLink: 'https://github.com/Kalliran'
},
+ {
+ artName: 'Loading Animation',
+ pageLink: './Art/loading/index.html',
+ imageLink: './Art/loading/loading.gif',
+ author: 'Ato186',
+ githubLink: 'https://github.com/Ato186'
+ },
];
/* -------------------------------------------------------------------------- */