diff --git a/README.md b/README.md
index 27c2f90..77690c7 100644
--- a/README.md
+++ b/README.md
@@ -47,18 +47,20 @@ npm run build
 
 ## 3. Application Specification
 
-### Availiable file extension
+### 3-1. Availiable file extension
 
 ```bash
 png jpg jpeg webp gif bmp ico tiff tif
 ```
 
-#### extension converting
+#### 3-2. extension converting
 
-### Image Processing
+### 3-3. Image Processing
 
 #### resize
 
+#### crop
+
 #### filter
 
 #### rotate
diff --git a/css/styles.css b/css/styles.css
index f32b835..ff674c3 100644
--- a/css/styles.css
+++ b/css/styles.css
@@ -130,11 +130,6 @@ select#extensionComboBox {
   background-color: transparent;
 }
 
-#cropBtn {
-  position: fixed;
-  top: 122px;
-  right: 0px;
-}
 
 #undoBtn {
   position: fixed;
diff --git a/imgkit/index.js b/imgkit/index.js
index 7e33275..b04b3d8 100644
--- a/imgkit/index.js
+++ b/imgkit/index.js
@@ -100,7 +100,6 @@ class Parameter {
 
 class ImageLayer {
   static drawFlag = false;
-  static cropFlag = false;
   static dragFlag = false;
 
   constructor() {
@@ -164,10 +163,35 @@ class ImageLayer {
 
     document.addEventListener("keydown", (event) => {
       if (
-        (event.ctrlKey && event.key === "d") ||
-        (event.key === "Delete" && document.activeElement === this.imgPanel)
+      (event.ctrlKey && event.key === "d") ||
+      (event.key === "Delete" && document.activeElement === this.imgPanel)
       ) {
-        deleteImagePanel();
+      deleteImagePanel();
+      } else if (
+      document.activeElement === this.imgPanel &&
+      (event.key === "ArrowLeft" || event.key === "ArrowRight")
+      ) {
+      if (event.ctrlKey && event.key === "ArrowLeft") {
+        Parameter.num = 0;
+        imageLayerQueue[Parameter.num].imgPanel.focus();
+        imageLayerQueue[Parameter.num].updateFocus();
+        imageLayerQueue[Parameter.num].updateSio();
+      } else if (event.ctrlKey && event.key === "ArrowRight") {
+        Parameter.num = imageLayerQueue.length - 1;
+        imageLayerQueue[Parameter.num].imgPanel.focus();
+        imageLayerQueue[Parameter.num].updateFocus();
+        imageLayerQueue[Parameter.num].updateSio();
+      } else if (event.key === "ArrowLeft" && Parameter.num > 0) {
+        Parameter.num--;
+        imageLayerQueue[Parameter.num].imgPanel.focus();
+        imageLayerQueue[Parameter.num].updateFocus();
+        imageLayerQueue[Parameter.num].updateSio();
+      } else if (event.key === "ArrowRight" && Parameter.num < imageLayerQueue.length - 1) {
+        Parameter.num++;
+        imageLayerQueue[Parameter.num].imgPanel.focus();
+        imageLayerQueue[Parameter.num].updateFocus();
+        imageLayerQueue[Parameter.num].updateSio();
+      }
       }
     });
 
@@ -337,7 +361,7 @@ class ImageLayer {
           event.clientY - this.canvas.getBoundingClientRect().top
         );
         this.canvas.addEventListener("mousemove", (evt) => {
-          if (ImageLayer.dragFlag && ImageLayer.drawFlag) {
+          if (ImageLayer.dragFlag) {
             this.ctx.lineTo(
               evt.x - this.canvas.getBoundingClientRect().left,
               evt.y - this.canvas.getBoundingClientRect().top
@@ -348,40 +372,66 @@ class ImageLayer {
         this.ctx.closePath();
       }
 
-      if (ImageLayer.cropFlag) {
+      if (document.body.style.cursor === "crosshair") {
         var ctxs = this.canvas.getContext("2d");
-        this.realPosX = event.clientX;
-        this.realPosY = event.clientY;
-        this.initialX =
-          event.clientX - this.canvas.getBoundingClientRect().left;
-        this.initialY = event.clientY - this.canvas.getBoundingClientRect().top;
+        const rect = this.canvas.getBoundingClientRect();
+        const startX = event.clientX - rect.left;
+        const startY = event.clientY - rect.top;
+        this.initialX = startX;
+        this.initialY = startY;
         ctxs.setLineDash([2]);
 
-        this.canvas.addEventListener("mousemove", (evt) => {
-          if (ImageLayer.dragFlag && ImageLayer.cropFlag) {
-            ctxs.clearRect(
-              0,
-              0,
-              this.canvas.clientWidth,
-              this.canvas.clientHeight
-            );
-            this.cropWidth = evt.clientX - event.clientX;
-            this.cropHeight = evt.clientY - event.clientY;
-            ctxs.drawImage(this.image, 0, 0);
-            ctxs.strokeRect(
-              this.initialX,
-              this.initialY,
-              this.cropWidth,
-              this.cropHeight
-            );
-          }
-        });
+        const mouseMoveHandler = (evt) => {
+          ctxs.clearRect(0, 0, this.canvas.clientWidth, this.canvas.clientHeight);
+          ctxs.drawImage(this.image, 0, 0);
+          const currX = evt.clientX - rect.left;
+          const currY = evt.clientY - rect.top;
+          // Calculate top-left and width/height regardless of drag direction
+          const x = Math.min(startX, currX);
+          const y = Math.min(startY, currY);
+          const w = Math.abs(currX - startX);
+          const h = Math.abs(currY - startY);
+          this.initialX = x;
+          this.initialY = y;
+          this.cropWidth = w;
+          this.cropHeight = h;
+          ctxs.strokeRect(x, y, w, h);
+        };
+        const mouseUpHandler = (evt) => {
+          this.canvas.removeEventListener("mousemove", mouseMoveHandler);
+          document.removeEventListener("mouseup", mouseUpHandler);
+          ImageLayer.dragFlag = false;
+        };
+        this.canvas.addEventListener("mousemove", mouseMoveHandler);
+        document.addEventListener("mouseup", mouseUpHandler);
       }
     });
 
     this.canvas.addEventListener("mouseup", (event) => {
-      if (ImageLayer.drawFlag) {
-        //paste
+      ImageLayer.dragFlag = false;
+      if (document.body.style.cursor === "crosshair") {
+        // cropWidth/cropHeight는 항상 양수, initialX/initialY는 항상 좌상단
+        const cropX = Math.round(this.initialX);
+        const cropY = Math.round(this.initialY);
+        const cropW = Math.round(this.cropWidth);
+        const cropH = Math.round(this.cropHeight);
+
+        if (
+          cropW > 0 &&
+          cropH > 0 &&
+          this.buffer &&
+          this.information &&
+          (cropX + cropW) <= this.information.width &&
+          (cropY + cropH) <= this.information.height
+        ) {
+          sharp(this.buffer)
+            .extract({ left: cropX, top: cropY, width: cropW, height: cropH })
+            .toBuffer((err, buf, info) => {
+              if (!err && buf && info) {
+                this.updatePreviewImg(buf, info);
+              }
+            });
+        }
       }
     });
 
@@ -793,7 +843,6 @@ module.exports = {
   ImageLayer: ImageLayer,
   Parameter: Parameter,
   drawFlag: ImageLayer.drawFlag,
-  cropFlag: ImageLayer.cropFlag,
   dragFlag: ImageLayer.dragFlag,
   imageLayerQueue: imageLayerQueue,
 };
diff --git a/index.html b/index.html
index b7cb3eb..f8932dd 100644
--- a/index.html
+++ b/index.html
@@ -19,6 +19,10 @@
     <div id="toolBox1">
       <button title="resize" id="resizeBtn">
         <img class="icon" src="assets/resize.ico" />
+      </button>
+      <button title="crop" id="cropBtn">
+        <img class="icon" src="assets/crop.ico" />
+      </button>
       <button title="filter" id="filterBtn">
         <img class="icon" src="assets/filter.ico" />
       </button>
diff --git a/main.js b/main.js
index cd7d9d4..4ec8986 100644
--- a/main.js
+++ b/main.js
@@ -78,7 +78,7 @@ app.whenReady().then(() => {
   // Open the DevTools.(only develop)
   // mainWindow.webContents.openDevTools();
 
-  ["resizeImgREQ", "filterImgREQ", "rotateImgREQ", "paintImgREQ"].forEach(
+  ["resizeImgREQ", "cropImgREQ",  "filterImgREQ", "rotateImgREQ", "paintImgREQ"].forEach(
     (item, index, arr) => {
       ipcMain.on(item, (event) => {
         mainWindow
@@ -289,7 +289,7 @@ app.whenReady().then(() => {
               dialog.showMessageBox({
                 title: "About",
                 buttons: ["Ok"],
-                message: `Author : Pascal Institute\nVersion : v${pkg.version}\nLicense : MIT License\n`,
+                message: `Author : ${pkg.author}\nVersion : v${pkg.version}\nLicense : ${pkg.license}\n`,
               });
             },
           },
diff --git a/package-lock.json b/package-lock.json
index 31f340f..4289e2d 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,12 +1,12 @@
 {
   "name": "pegasus",
-  "version": "1.0.3",
+  "version": "1.0.4",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "pegasus",
-      "version": "1.0.3",
+      "version": "1.0.4",
       "license": "MIT",
       "dependencies": {
         "fs": "^0.0.1-security",
@@ -113,9 +113,9 @@
       }
     },
     "node_modules/@electron/fuses/node_modules/jsonfile": {
-      "version": "6.1.0",
-      "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-6.1.0.tgz",
-      "integrity": "sha512-5dgndWOriYSm5cnYaJNhalLNDKOqFwyDB/rr1E9ZsGciGvKPs8R2xYGCacuf3z6K1YKDz182fd+fY3cn3pMqXQ==",
+      "version": "6.2.0",
+      "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-6.2.0.tgz",
+      "integrity": "sha512-FGuPw30AdOIUTRMC2OMRtQV+jkVj2cfPqSeWXv1NEAJ1qZ5zb1X6z1mFhbfOB/iy3ssJCD+3KuZ8r8C3uVFlAg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -271,9 +271,9 @@
       }
     },
     "node_modules/@electron/notarize/node_modules/jsonfile": {
-      "version": "6.1.0",
-      "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-6.1.0.tgz",
-      "integrity": "sha512-5dgndWOriYSm5cnYaJNhalLNDKOqFwyDB/rr1E9ZsGciGvKPs8R2xYGCacuf3z6K1YKDz182fd+fY3cn3pMqXQ==",
+      "version": "6.2.0",
+      "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-6.2.0.tgz",
+      "integrity": "sha512-FGuPw30AdOIUTRMC2OMRtQV+jkVj2cfPqSeWXv1NEAJ1qZ5zb1X6z1mFhbfOB/iy3ssJCD+3KuZ8r8C3uVFlAg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -344,9 +344,9 @@
       }
     },
     "node_modules/@electron/osx-sign/node_modules/jsonfile": {
-      "version": "6.1.0",
-      "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-6.1.0.tgz",
-      "integrity": "sha512-5dgndWOriYSm5cnYaJNhalLNDKOqFwyDB/rr1E9ZsGciGvKPs8R2xYGCacuf3z6K1YKDz182fd+fY3cn3pMqXQ==",
+      "version": "6.2.0",
+      "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-6.2.0.tgz",
+      "integrity": "sha512-FGuPw30AdOIUTRMC2OMRtQV+jkVj2cfPqSeWXv1NEAJ1qZ5zb1X6z1mFhbfOB/iy3ssJCD+3KuZ8r8C3uVFlAg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -411,9 +411,9 @@
       }
     },
     "node_modules/@electron/rebuild/node_modules/jsonfile": {
-      "version": "6.1.0",
-      "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-6.1.0.tgz",
-      "integrity": "sha512-5dgndWOriYSm5cnYaJNhalLNDKOqFwyDB/rr1E9ZsGciGvKPs8R2xYGCacuf3z6K1YKDz182fd+fY3cn3pMqXQ==",
+      "version": "6.2.0",
+      "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-6.2.0.tgz",
+      "integrity": "sha512-FGuPw30AdOIUTRMC2OMRtQV+jkVj2cfPqSeWXv1NEAJ1qZ5zb1X6z1mFhbfOB/iy3ssJCD+3KuZ8r8C3uVFlAg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -491,9 +491,9 @@
       }
     },
     "node_modules/@electron/universal/node_modules/jsonfile": {
-      "version": "6.1.0",
-      "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-6.1.0.tgz",
-      "integrity": "sha512-5dgndWOriYSm5cnYaJNhalLNDKOqFwyDB/rr1E9ZsGciGvKPs8R2xYGCacuf3z6K1YKDz182fd+fY3cn3pMqXQ==",
+      "version": "6.2.0",
+      "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-6.2.0.tgz",
+      "integrity": "sha512-FGuPw30AdOIUTRMC2OMRtQV+jkVj2cfPqSeWXv1NEAJ1qZ5zb1X6z1mFhbfOB/iy3ssJCD+3KuZ8r8C3uVFlAg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -569,9 +569,9 @@
       }
     },
     "node_modules/@electron/windows-sign/node_modules/jsonfile": {
-      "version": "6.1.0",
-      "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-6.1.0.tgz",
-      "integrity": "sha512-5dgndWOriYSm5cnYaJNhalLNDKOqFwyDB/rr1E9ZsGciGvKPs8R2xYGCacuf3z6K1YKDz182fd+fY3cn3pMqXQ==",
+      "version": "6.2.0",
+      "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-6.2.0.tgz",
+      "integrity": "sha512-FGuPw30AdOIUTRMC2OMRtQV+jkVj2cfPqSeWXv1NEAJ1qZ5zb1X6z1mFhbfOB/iy3ssJCD+3KuZ8r8C3uVFlAg==",
       "dev": true,
       "license": "MIT",
       "optional": true,
@@ -1072,9 +1072,9 @@
       }
     },
     "node_modules/@isaacs/cliui/node_modules/ansi-regex": {
-      "version": "6.1.0",
-      "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-6.1.0.tgz",
-      "integrity": "sha512-7HSX4QQb4CspciLpVFwyRe79O3xsIZDDLER21kERQ71oaPodF8jL725AgJMFAYbooIqolJoRLuM81SpeUkpkvA==",
+      "version": "6.2.0",
+      "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-6.2.0.tgz",
+      "integrity": "sha512-TKY5pyBkHyADOPYlRT9Lx6F544mPl0vS5Ew7BJ45hA08Q+t3GjbueLliBWN3sMICk6+y7HdyxSzC4bWS8baBdg==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -1212,9 +1212,9 @@
       }
     },
     "node_modules/@malept/flatpak-bundler/node_modules/jsonfile": {
-      "version": "6.1.0",
-      "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-6.1.0.tgz",
-      "integrity": "sha512-5dgndWOriYSm5cnYaJNhalLNDKOqFwyDB/rr1E9ZsGciGvKPs8R2xYGCacuf3z6K1YKDz182fd+fY3cn3pMqXQ==",
+      "version": "6.2.0",
+      "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-6.2.0.tgz",
+      "integrity": "sha512-FGuPw30AdOIUTRMC2OMRtQV+jkVj2cfPqSeWXv1NEAJ1qZ5zb1X6z1mFhbfOB/iy3ssJCD+3KuZ8r8C3uVFlAg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -1381,9 +1381,9 @@
       "license": "MIT"
     },
     "node_modules/@types/node": {
-      "version": "22.17.1",
-      "resolved": "https://registry.npmjs.org/@types/node/-/node-22.17.1.tgz",
-      "integrity": "sha512-y3tBaz+rjspDTylNjAX37jEC3TETEFGNJL6uQDxwF9/8GLLIjW1rvVHlynyuUKMnMr1Roq8jOv3vkopBjC4/VA==",
+      "version": "22.18.0",
+      "resolved": "https://registry.npmjs.org/@types/node/-/node-22.18.0.tgz",
+      "integrity": "sha512-m5ObIqwsUp6BZzyiy4RdZpzWGub9bqLJMvZDD0QMXhxjqMHMENlj+SqF5QxoUwaQNFe+8kz8XM8ZQhqkQPTgMQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -1432,9 +1432,9 @@
       }
     },
     "node_modules/@xmldom/xmldom": {
-      "version": "0.8.10",
-      "resolved": "https://registry.npmjs.org/@xmldom/xmldom/-/xmldom-0.8.10.tgz",
-      "integrity": "sha512-2WALfTl4xo2SkGCYRt6rDTFfk9R1czmBvUQy12gK2KuRKIpWEhcbbzy8EZXtz/jkRqHX8bFEc6FC1HjX4TUWYw==",
+      "version": "0.8.11",
+      "resolved": "https://registry.npmjs.org/@xmldom/xmldom/-/xmldom-0.8.11.tgz",
+      "integrity": "sha512-cQzWCtO6C8TQiYl1ruKNn2U6Ao4o4WBBcbL61yJl84x+j5sOWWFU9X7DpND8XZG3daDppSsigMdfAIl2upQBRw==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -1631,9 +1631,9 @@
       }
     },
     "node_modules/app-builder-lib/node_modules/jsonfile": {
-      "version": "6.1.0",
-      "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-6.1.0.tgz",
-      "integrity": "sha512-5dgndWOriYSm5cnYaJNhalLNDKOqFwyDB/rr1E9ZsGciGvKPs8R2xYGCacuf3z6K1YKDz182fd+fY3cn3pMqXQ==",
+      "version": "6.2.0",
+      "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-6.2.0.tgz",
+      "integrity": "sha512-FGuPw30AdOIUTRMC2OMRtQV+jkVj2cfPqSeWXv1NEAJ1qZ5zb1X6z1mFhbfOB/iy3ssJCD+3KuZ8r8C3uVFlAg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -1941,9 +1941,9 @@
       }
     },
     "node_modules/builder-util/node_modules/jsonfile": {
-      "version": "6.1.0",
-      "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-6.1.0.tgz",
-      "integrity": "sha512-5dgndWOriYSm5cnYaJNhalLNDKOqFwyDB/rr1E9ZsGciGvKPs8R2xYGCacuf3z6K1YKDz182fd+fY3cn3pMqXQ==",
+      "version": "6.2.0",
+      "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-6.2.0.tgz",
+      "integrity": "sha512-FGuPw30AdOIUTRMC2OMRtQV+jkVj2cfPqSeWXv1NEAJ1qZ5zb1X6z1mFhbfOB/iy3ssJCD+3KuZ8r8C3uVFlAg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -2693,9 +2693,9 @@
       }
     },
     "node_modules/dmg-builder/node_modules/jsonfile": {
-      "version": "6.1.0",
-      "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-6.1.0.tgz",
-      "integrity": "sha512-5dgndWOriYSm5cnYaJNhalLNDKOqFwyDB/rr1E9ZsGciGvKPs8R2xYGCacuf3z6K1YKDz182fd+fY3cn3pMqXQ==",
+      "version": "6.2.0",
+      "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-6.2.0.tgz",
+      "integrity": "sha512-FGuPw30AdOIUTRMC2OMRtQV+jkVj2cfPqSeWXv1NEAJ1qZ5zb1X6z1mFhbfOB/iy3ssJCD+3KuZ8r8C3uVFlAg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -2810,9 +2810,9 @@
       }
     },
     "node_modules/electron": {
-      "version": "37.3.0",
-      "resolved": "https://registry.npmjs.org/electron/-/electron-37.3.0.tgz",
-      "integrity": "sha512-cPOPUD26DwCh+PZ9q+gMyVBvdBN75SnekI6u5zcOeoLVIXQpzrCm1ewz9BcrkWkVW7oOtfQAEo1G1SffvXrSSw==",
+      "version": "37.3.1",
+      "resolved": "https://registry.npmjs.org/electron/-/electron-37.3.1.tgz",
+      "integrity": "sha512-7DhktRLqhe6OJh/Bo75bTI0puUYEmIwSzMinocgO63mx3MVjtIn2tYMzLmAleNIlud2htkjpsMG2zT4PiTCloA==",
       "dev": true,
       "hasInstallScript": true,
       "license": "MIT",
@@ -2883,9 +2883,9 @@
       }
     },
     "node_modules/electron-builder/node_modules/jsonfile": {
-      "version": "6.1.0",
-      "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-6.1.0.tgz",
-      "integrity": "sha512-5dgndWOriYSm5cnYaJNhalLNDKOqFwyDB/rr1E9ZsGciGvKPs8R2xYGCacuf3z6K1YKDz182fd+fY3cn3pMqXQ==",
+      "version": "6.2.0",
+      "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-6.2.0.tgz",
+      "integrity": "sha512-FGuPw30AdOIUTRMC2OMRtQV+jkVj2cfPqSeWXv1NEAJ1qZ5zb1X6z1mFhbfOB/iy3ssJCD+3KuZ8r8C3uVFlAg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -2938,9 +2938,9 @@
       }
     },
     "node_modules/electron-publish/node_modules/jsonfile": {
-      "version": "6.1.0",
-      "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-6.1.0.tgz",
-      "integrity": "sha512-5dgndWOriYSm5cnYaJNhalLNDKOqFwyDB/rr1E9ZsGciGvKPs8R2xYGCacuf3z6K1YKDz182fd+fY3cn3pMqXQ==",
+      "version": "6.2.0",
+      "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-6.2.0.tgz",
+      "integrity": "sha512-FGuPw30AdOIUTRMC2OMRtQV+jkVj2cfPqSeWXv1NEAJ1qZ5zb1X6z1mFhbfOB/iy3ssJCD+3KuZ8r8C3uVFlAg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -3006,9 +3006,9 @@
       }
     },
     "node_modules/electron-rebuild/node_modules/jsonfile": {
-      "version": "6.1.0",
-      "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-6.1.0.tgz",
-      "integrity": "sha512-5dgndWOriYSm5cnYaJNhalLNDKOqFwyDB/rr1E9ZsGciGvKPs8R2xYGCacuf3z6K1YKDz182fd+fY3cn3pMqXQ==",
+      "version": "6.2.0",
+      "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-6.2.0.tgz",
+      "integrity": "sha512-FGuPw30AdOIUTRMC2OMRtQV+jkVj2cfPqSeWXv1NEAJ1qZ5zb1X6z1mFhbfOB/iy3ssJCD+3KuZ8r8C3uVFlAg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -3932,15 +3932,11 @@
       "license": "ISC"
     },
     "node_modules/ip-address": {
-      "version": "9.0.5",
-      "resolved": "https://registry.npmjs.org/ip-address/-/ip-address-9.0.5.tgz",
-      "integrity": "sha512-zHtQzGojZXTwZTHQqra+ETKd4Sn3vgi7uBmlPoXVWZqYvuKmtI0l/VZTjqGmJY9x88GGOaZ9+G9ES8hC4T4X8g==",
+      "version": "10.0.1",
+      "resolved": "https://registry.npmjs.org/ip-address/-/ip-address-10.0.1.tgz",
+      "integrity": "sha512-NWv9YLW4PoW2B7xtzaS3NCot75m6nK7Icdv0o3lfMceJVRfSoQwqD4wEH5rLwoKJwUiZ/rfpiVBhnaF0FK4HoA==",
       "dev": true,
       "license": "MIT",
-      "dependencies": {
-        "jsbn": "1.1.0",
-        "sprintf-js": "^1.1.3"
-      },
       "engines": {
         "node": ">= 12"
       }
@@ -4117,13 +4113,6 @@
         "js-yaml": "bin/js-yaml.js"
       }
     },
-    "node_modules/jsbn": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/jsbn/-/jsbn-1.1.0.tgz",
-      "integrity": "sha512-4bYVV3aAMtDTTu4+xsDYa6sy9GyJ69/amsu9sYF2zqjiEoZA5xJi3BrfX3uY+/IekIu7MwdObdbDWpoZdBv3/A==",
-      "dev": true,
-      "license": "MIT"
-    },
     "node_modules/json-buffer": {
       "version": "3.0.1",
       "resolved": "https://registry.npmjs.org/json-buffer/-/json-buffer-3.0.1.tgz",
@@ -5466,13 +5455,13 @@
       }
     },
     "node_modules/socks": {
-      "version": "2.8.6",
-      "resolved": "https://registry.npmjs.org/socks/-/socks-2.8.6.tgz",
-      "integrity": "sha512-pe4Y2yzru68lXCb38aAqRf5gvN8YdjP1lok5o0J7BOHljkyCGKVz7H3vpVIXKD27rj2giOJ7DwVyk/GWrPHDWA==",
+      "version": "2.8.7",
+      "resolved": "https://registry.npmjs.org/socks/-/socks-2.8.7.tgz",
+      "integrity": "sha512-HLpt+uLy/pxB+bum/9DzAgiKS8CX1EvbWxI4zlmgGCExImLdiad2iCwXT5Z4c9c3Eq8rP2318mPW2c+QbtjK8A==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "ip-address": "^9.0.5",
+        "ip-address": "^10.0.1",
         "smart-buffer": "^4.2.0"
       },
       "engines": {
@@ -5534,7 +5523,8 @@
       "resolved": "https://registry.npmjs.org/sprintf-js/-/sprintf-js-1.1.3.tgz",
       "integrity": "sha512-Oo+0REFV59/rz3gfJNKQiBlwfHaSESl1pcGyABQsnnIfWOFt6JNj5gCog2U6MLZ//IGYD+nA8nI+mTShREReaA==",
       "dev": true,
-      "license": "BSD-3-Clause"
+      "license": "BSD-3-Clause",
+      "optional": true
     },
     "node_modules/ssri": {
       "version": "9.0.1",
@@ -5723,9 +5713,9 @@
       }
     },
     "node_modules/temp-file/node_modules/jsonfile": {
-      "version": "6.1.0",
-      "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-6.1.0.tgz",
-      "integrity": "sha512-5dgndWOriYSm5cnYaJNhalLNDKOqFwyDB/rr1E9ZsGciGvKPs8R2xYGCacuf3z6K1YKDz182fd+fY3cn3pMqXQ==",
+      "version": "6.2.0",
+      "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-6.2.0.tgz",
+      "integrity": "sha512-FGuPw30AdOIUTRMC2OMRtQV+jkVj2cfPqSeWXv1NEAJ1qZ5zb1X6z1mFhbfOB/iy3ssJCD+3KuZ8r8C3uVFlAg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
diff --git a/package.json b/package.json
index 7268034..8f2cd10 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "pegasus",
-  "version": "1.0.3",
+  "version": "1.0.4",
   "description": "",
   "main": "main.js",
   "dependencies": {
@@ -38,6 +38,10 @@
     "mac": {
       "target": []
     },
+    "linux": {
+      "icon": "assets/icon.ico",
+      "target": ["AppImage", "deb", "rpm"]
+    },
     "nsis": {
       "oneClick": false,
       "allowToChangeInstallationDirectory": true
@@ -59,6 +63,9 @@
       }
     ]
   },
-  "author": "Pascal Institute",
+  "author": {
+    "name": "Pascal Institute",
+    "email": "volta2030@gmail.com"
+  },
   "license": "MIT"
 }
diff --git a/pages/crop_panel.html b/pages/crop_panel.html
new file mode 100644
index 0000000..0e6becd
--- /dev/null
+++ b/pages/crop_panel.html
@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <link href="../css/panel.css" rel="stylesheet" />
+    <title>Crop</title>
+  </head>
+  <body>
+    <script src="../renderer/crop_renderer.js"></script>
+  </body>
+</html>
diff --git a/pages/resize_panel.html b/pages/resize_panel.html
index fe69bad..74b0291 100644
--- a/pages/resize_panel.html
+++ b/pages/resize_panel.html
@@ -19,9 +19,6 @@
       />
       <button id="resizeExecuteBtn">Execute</button>
     </div>
-    <button title="crop" id="cropBtn">
-      <img class="icon" src="../assets/crop.ico" />
-    </button>
     <script src="../renderer/resize_renderer.js"></script>
   </body>
 </html>
diff --git a/renderer/crop_renderer.js b/renderer/crop_renderer.js
new file mode 100644
index 0000000..6438775
--- /dev/null
+++ b/renderer/crop_renderer.js
@@ -0,0 +1,2 @@
+const { ipcRenderer } = require("electron");
+var {drawFlag} = require("imgkit");
\ No newline at end of file
diff --git a/renderer/main_renderer.js b/renderer/main_renderer.js
index 4696513..0575c8e 100644
--- a/renderer/main_renderer.js
+++ b/renderer/main_renderer.js
@@ -1,16 +1,17 @@
 const { ipcRenderer } = require("electron");
-const { ImageLayer, Parameter, imageLayerQueue, drawFlag } = require("imgkit");
+const { ImageLayer, Parameter, imageLayerQueue} = require("imgkit");
 var { num } = require("imgkit");
 const sharp = require("sharp");
 var path = require("path");
 var fullScreenFlag = false;
 var lineWidth = 1;
 
-const buttons = ["resizeBtn", "filterBtn", "rotateBtn", "paintBtn"];
+const buttons = ["resizeBtn", "cropBtn", "filterBtn", "rotateBtn", "paintBtn"];
 
 buttons.forEach((btnId) => {
   const btn = document.getElementById(btnId);
   btn.addEventListener("click", (event) => {
+    document.body.style.cursor = "default";
     buttons.forEach((id) => {
       document.getElementById(id).style.borderBottom = "2px solid #333";
     });
@@ -18,7 +19,6 @@ buttons.forEach((btnId) => {
     event.currentTarget.style.borderBottom = "none";
 
     ipcRenderer.send(`${btnId.replace("Btn", "")}ImgREQ`);
-    ImageLayer.cropFlag = false;
     ImageLayer.drawFlag = false;
   });
 });
@@ -26,8 +26,9 @@ buttons.forEach((btnId) => {
 ipcRenderer.send("showMenuREQ", "ping");
 
 ipcRenderer.on("resizeImgCMD", (event, res) => {
+  const newWidth = Math.floor(imageLayerQueue[Parameter.num].canvas.width * res);
   sharp(imageLayerQueue[Parameter.num].buffer)
-    .resize({ width: imageLayerQueue[Parameter.num].canvas.width * res })
+    .resize({ width: newWidth })
     .toBuffer((err, buf, info) => {
       imageLayerQueue[Parameter.num].updatePreviewImg(buf, info);
     });
@@ -139,16 +140,8 @@ ipcRenderer.on("tintImgCMD", (event, res) => {
 });
 
 ipcRenderer.on("cropImgCMD", (event, res) => {
-  ImageLayer.cropFlag = res;
-  ImageLayer.dragFlag = false;
-  // initialX = initialY = cropWidth = cropHeight = 0;
-  if (ImageLayer.cropFlag) {
     imageLayerQueue[Parameter.num].canvas.setAttribute("draggable", false);
     document.body.style.cursor = "crosshair";
-  } else {
-    imageLayerQueue[Parameter.num].canvas.setAttribute("draggable", true);
-    document.body.style.cursor = "default";
-  }
 });
 
 ipcRenderer.on("drawImgCMD", (event, res) => {
@@ -189,45 +182,6 @@ sioCheckBox.addEventListener("click", (event) => {
   }
 });
 
-document.body.addEventListener("mouseup", (event) => {
-  ImageLayer.dragFlag = false;
-  if (
-    ImageLayer.cropFlag &&
-    event.x - imageLayerQueue[Parameter.num].realPosX <
-      imageLayerQueue[Parameter.num].canvas.clientWidth &&
-    event.y - imageLayerQueue[Parameter.num].realPosY <
-      imageLayerQueue[Parameter.num].canvas.clientHeight
-  ) {
-    if (
-      imageLayerQueue[Parameter.num].cropWidth < 0 ||
-      imageLayerQueue[Parameter.num].cropHeight < 0 ||
-      imageLayerQueue[Parameter.num].cropWidth >
-        imageLayerQueue[Parameter.num].canvas.clientWidth ||
-      imageLayerQueue[Parameter.num].cropHeight >
-        imageLayerQueue[Parameter.num].canvas.clientHeight
-    ) {
-      this.ctx.clearRect(
-        0,
-        0,
-        imageLayerQueue[Parameter.num].canvas.clientWidth,
-        imageLayerQueue[Parameter.num].canvas.clientHeight
-      );
-      this.ctx.drawImage(imageLayerQueue[Parameter.num].image, 0, 0);
-    } else {
-      sharp(imageLayerQueue[Parameter.num].buffer)
-        .extract({
-          left: parseInt(imageLayerQueue[Parameter.num].initialX),
-          top: parseInt(imageLayerQueue[Parameter.num].initialY),
-          width: parseInt(imageLayerQueue[Parameter.num].cropWidth),
-          height: parseInt(imageLayerQueue[Parameter.num].cropHeight),
-        })
-        .toBuffer((err, buf, info) => {
-          imageLayerQueue[Parameter.num].updatePreviewImg(buf, info);
-        });
-    }
-  }
-});
-
 imageLayerQueue[Parameter.num].openImg("./assets/addImage.png");
 console.log(imageLayerQueue[Parameter.num].filepath);
 ipcRenderer.on("openImgCMD", (event, res) => {
diff --git a/renderer/paint_renderer.js b/renderer/paint_renderer.js
index 52c362e..d85e323 100644
--- a/renderer/paint_renderer.js
+++ b/renderer/paint_renderer.js
@@ -1,5 +1,5 @@
 const { ipcRenderer } = require("electron");
-var { drawFlag, cropFlag } = require("imgkit");
+var { drawFlag} = require("imgkit");
 
 var rgb = { r: "123", g: "123", b: "123" };
 
@@ -7,7 +7,7 @@ document.getElementById("drawBtn").addEventListener("click", () => {
   if (!drawFlag) {
     drawFlag = true;
     document.getElementById("drawBtn").style.backgroundColor = "gray";
-    if (cropFlag) cropFlag = false;
+
   } else {
     drawFlag = false;
     document.getElementById("drawBtn").style.backgroundColor = "#efefef";
diff --git a/renderer/resize_renderer.js b/renderer/resize_renderer.js
index 13b3747..3812d20 100644
--- a/renderer/resize_renderer.js
+++ b/renderer/resize_renderer.js
@@ -1,5 +1,4 @@
 const { ipcRenderer } = require("electron");
-var { cropFlag, drawFlag } = require("imgkit");
 
 var scale = 2;
 
@@ -9,16 +8,4 @@ document.getElementById("resizeValue").addEventListener("input", (event) => {
 
 document.getElementById("resizeExecuteBtn").addEventListener("click", () => {
   ipcRenderer.send("resizeValueSEND", scale);
-});
-
-document.getElementById("cropBtn").addEventListener("click", () => {
-  if (!cropFlag) {
-    cropFlag = true;
-    document.getElementById("cropBtn").style.backgroundColor = "gray";
-    if (drawFlag) drawFlag = false;
-  } else {
-    cropFlag = false;
-    document.getElementById("cropBtn").style.backgroundColor = "#efefef";
-  }
-  ipcRenderer.send("cropImgREQ", cropFlag);
-});
+});
\ No newline at end of file