diff --git a/src/components/screens/Characters.vue b/src/components/screens/Characters.vue
index 3b711ec..0cfef1b 100644
--- a/src/components/screens/Characters.vue
+++ b/src/components/screens/Characters.vue
@@ -266,6 +266,7 @@ function create() {
         display: flex;
         gap: 15px;
         align-items: center;
+        transition: ease-in-out gap 0.2s;
 
         span {
           margin: auto;
@@ -280,6 +281,10 @@ function create() {
           background-color: rgba($cyan, 0.5);
           cursor: not-allowed;
         }
+
+        &:hover {
+          gap: 20px;
+        }
       }
     }
   }
diff --git a/src/components/utilities/Modal.vue b/src/components/utilities/Modal.vue
index 9a55f61..3917aa4 100644
--- a/src/components/utilities/Modal.vue
+++ b/src/components/utilities/Modal.vue
@@ -139,7 +139,7 @@ onUnmounted(() => {
 
       &:hover {
         transform: rotate(180deg);
-        transition: ease-in-out 0.3s;
+        transition: ease-in-out transform 0.3s;
       }
     }
   }