diff --git a/README.md b/README.md
index d231d99..81b470d 100644
--- a/README.md
+++ b/README.md
@@ -58,9 +58,9 @@
 - 💪 Built with typescript.
 - 💡 Easy-to-understand API and a completely configurable React component.
 
-<!-- ## 🎥 Demo <a name = "demo"></a> -->
+</br>
 
-![demo](demo.png)
+![demo](demo.gif)
 
 ## 💭 How it works <a name = "working"></a>
 
diff --git a/demo.gif b/demo.gif
new file mode 100644
index 0000000..31695cb
Binary files /dev/null and b/demo.gif differ
diff --git a/package.json b/package.json
index feca278..bf16955 100644
--- a/package.json
+++ b/package.json
@@ -67,7 +67,7 @@
     "@babel/core": "^7.20.2",
     "@babel/plugin-proposal-optional-chaining": "^7.18.9",
     "@babel/plugin-transform-runtime": "^7.19.6",
-    "@rollup/plugin-babel": "^6.0.2",
+    "@rollup/plugin-babel": "^6.0.3",
     "@rollup/plugin-buble": "^1.0.1",
     "@rollup/plugin-commonjs": "^23.0.2",
     "@rollup/plugin-eslint": "^9.0.1",
@@ -94,7 +94,7 @@
     "eslint-plugin-sort-keys-fix": "^1.1.2",
     "husky": "^8.0.2",
     "jest": "^29.3.1",
-    "lint-staged": "^13.0.3",
+    "lint-staged": "^13.0.4",
     "postcss": "^8.4.19",
     "postcss-modules": "^6.0.0",
     "postcss-preset-env": "^7.8.3",
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 1f45cee..41f6d00 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -4,7 +4,7 @@ specifiers:
   "@babel/core": ^7.20.2
   "@babel/plugin-proposal-optional-chaining": ^7.18.9
   "@babel/plugin-transform-runtime": ^7.19.6
-  "@rollup/plugin-babel": ^6.0.2
+  "@rollup/plugin-babel": ^6.0.3
   "@rollup/plugin-buble": ^1.0.1
   "@rollup/plugin-commonjs": ^23.0.2
   "@rollup/plugin-eslint": ^9.0.1
@@ -32,7 +32,7 @@ specifiers:
   eslint-plugin-sort-keys-fix: ^1.1.2
   husky: ^8.0.2
   jest: ^29.3.1
-  lint-staged: ^13.0.3
+  lint-staged: ^13.0.4
   nanoid: ^4.0.0
   postcss: ^8.4.19
   postcss-modules: ^6.0.0
@@ -69,7 +69,7 @@ devDependencies:
   "@babel/core": 7.20.2
   "@babel/plugin-proposal-optional-chaining": 7.18.9_@babel+core@7.20.2
   "@babel/plugin-transform-runtime": 7.19.6_@babel+core@7.20.2
-  "@rollup/plugin-babel": 6.0.2_ecxuj7zm5zl7qcys7nvyfh7ewm
+  "@rollup/plugin-babel": 6.0.3_ecxuj7zm5zl7qcys7nvyfh7ewm
   "@rollup/plugin-buble": 1.0.1_rollup@3.4.0
   "@rollup/plugin-commonjs": 23.0.2_rollup@3.4.0
   "@rollup/plugin-eslint": 9.0.1_rollup@3.4.0
@@ -96,7 +96,7 @@ devDependencies:
   eslint-plugin-sort-keys-fix: 1.1.2
   husky: 8.0.2
   jest: 29.3.1
-  lint-staged: 13.0.3
+  lint-staged: 13.0.4
   postcss: 8.4.19
   postcss-modules: 6.0.0_postcss@8.4.19
   postcss-preset-env: 7.8.3_postcss@8.4.19
@@ -1369,10 +1369,10 @@ packages:
       fastq: 1.13.0
     dev: true
 
-  /@rollup/plugin-babel/6.0.2_ecxuj7zm5zl7qcys7nvyfh7ewm:
+  /@rollup/plugin-babel/6.0.3_ecxuj7zm5zl7qcys7nvyfh7ewm:
     resolution:
       {
-        integrity: sha512-Vnt8XIWYwCf3MD7qhBWYlP9pjSZvcE++nlPXhQYw6YNehl5742AzFbrV6h4BHb20VAOVUlIksVLymQCTwVCGDg==,
+        integrity: sha512-fKImZKppa1A/gX73eg4JGo+8kQr/q1HBQaCGKECZ0v4YBBv3lFqi14+7xyApECzvkLTHCifx+7ntcrvtBIRcpg==,
       }
     engines: { node: ">=14.0.0" }
     peerDependencies:
@@ -6168,6 +6168,14 @@ packages:
     engines: { node: ">=10" }
     dev: true
 
+  /lilconfig/2.0.6:
+    resolution:
+      {
+        integrity: sha512-9JROoBW7pobfsx+Sq2JsASvCo6Pfo6WWoUW79HuB1BCoBXD4PLWJPqDF6fNj67pqBYTbAHkE57M1kS/+L1neOg==,
+      }
+    engines: { node: ">=10" }
+    dev: true
+
   /lines-and-columns/1.2.4:
     resolution:
       {
@@ -6175,10 +6183,10 @@ packages:
       }
     dev: true
 
-  /lint-staged/13.0.3:
+  /lint-staged/13.0.4:
     resolution:
       {
-        integrity: sha512-9hmrwSCFroTSYLjflGI8Uk+GWAwMB4OlpU4bMJEAT5d/llQwtYKoim4bLOyLCuWFAhWEupE0vkIFqtw/WIsPug==,
+        integrity: sha512-HxlHCXoYRsq9QCby5wFozmZW00hMs/9e3l+/dz6Qr8Kle4UH0kJTdABAbqhzG+3pcG6QjL9kz7NgGBfph+a5dw==,
       }
     engines: { node: ^14.13.1 || >=16.0.0 }
     hasBin: true
@@ -6188,8 +6196,8 @@ packages:
       commander: 9.4.1
       debug: 4.3.4
       execa: 6.1.0
-      lilconfig: 2.0.5
-      listr2: 4.0.5
+      lilconfig: 2.0.6
+      listr2: 5.0.5
       micromatch: 4.0.5
       normalize-path: 3.0.0
       object-inspect: 1.12.2
@@ -6201,12 +6209,12 @@ packages:
       - supports-color
     dev: true
 
-  /listr2/4.0.5:
+  /listr2/5.0.5:
     resolution:
       {
-        integrity: sha512-juGHV1doQdpNT3GSTs9IUN43QJb7KHdF9uqg7Vufs/tG9VTzpFphqF4pm/ICdAABGQxsyNn9CiYA3StkI6jpwA==,
+        integrity: sha512-DpBel6fczu7oQKTXMekeprc0o3XDgGMkD7JNYyX+X0xbwK+xgrx9dcyKoXKqpLSUvAWfmoePS7kavniOcq3r4w==,
       }
-    engines: { node: ">=12" }
+    engines: { node: ^14.13.1 || >=16.0.0 }
     peerDependencies:
       enquirer: ">= 2.3.0 < 3"
     peerDependenciesMeta:
@@ -7365,7 +7373,7 @@ packages:
       ts-node:
         optional: true
     dependencies:
-      lilconfig: 2.0.5
+      lilconfig: 2.0.6
       postcss: 8.4.19
       yaml: 1.10.2
     dev: true
diff --git a/react-visual-grid.gif b/react-visual-grid.gif
deleted file mode 100644
index 2a4c1f0..0000000
Binary files a/react-visual-grid.gif and /dev/null differ