diff --git a/Art/dbAnimation/dbanimation.gif b/Art/dbAnimation/dbanimation.gif
new file mode 100644
index 000000000..56a5bc479
Binary files /dev/null and b/Art/dbAnimation/dbanimation.gif differ
diff --git a/Art/dbAnimation/index.html b/Art/dbAnimation/index.html
new file mode 100644
index 000000000..41180dfed
--- /dev/null
+++ b/Art/dbAnimation/index.html
@@ -0,0 +1,14 @@
+
+
+
+
+
+ Animation
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/Art/dbAnimation/style.css b/Art/dbAnimation/style.css
new file mode 100644
index 000000000..6162f2b3d
--- /dev/null
+++ b/Art/dbAnimation/style.css
@@ -0,0 +1,37 @@
+body {
+ background-color: rgb(51, 45, 45);
+ display: grid;
+ height: 90vh;
+ place-content: center;
+}
+
+.squere-rounded-corners {
+ width: 200px;
+ height: 200px;
+ background-color: azure;
+ border-radius: 8px;
+ transition: transform 0.9s ease;
+ animation: color 4s infinite;
+}
+
+.squere-rounded-corners:hover {
+ transform: rotate(360deg);
+}
+
+@keyframes color {
+ 0% {
+ background-color: crimson;
+ }
+ 25% {
+ background-color: darkorange;
+ }
+ 50% {
+ background-color: darkblue;
+ }
+ 75% {
+ background-color: fuchsia;
+ }
+ 100% {
+ background-color:lightgreen;
+ }
+}
\ No newline at end of file
diff --git a/include.js b/include.js
index 5fec8e863..e36bdbc0a 100644
--- a/include.js
+++ b/include.js
@@ -2903,6 +2903,13 @@ let cards = [
author: 'Kalliran',
githubLink: 'https://github.com/Kalliran'
},
+ {
+ artName: 'dbAnimation',
+ pageLink: './Art/db1830/index.html',
+ imageLink: './Art/db1830/dbanimation.gif',
+ author: 'Daveed',
+ githubLink: 'https://github.com/db1830'
+ },
];
/* -------------------------------------------------------------------------- */