diff --git a/packages/nextjs/components/Writer.tsx b/packages/nextjs/components/Writer.tsx
index f9c7a35..1973ea1 100644
--- a/packages/nextjs/components/Writer.tsx
+++ b/packages/nextjs/components/Writer.tsx
@@ -42,4 +42,7 @@ const FactButton = styled.div`
   font-size: 12px;
   font-weight: 600;
   cursor: pointer;
+  &:active {
+    transform: scale(0.9);
+  }
 `;
diff --git a/packages/nextjs/pages/report/index.tsx b/packages/nextjs/pages/report/index.tsx
index c5daaa1..84a2238 100644
--- a/packages/nextjs/pages/report/index.tsx
+++ b/packages/nextjs/pages/report/index.tsx
@@ -264,16 +264,9 @@ function CreateNFTWhenContractExist() {
             <StyledMenuItem value={"collapse"}>Collapse</StyledMenuItem>
           </Select>
         </FormControl>
-        <Button
-          style={{
-            padding: "10px 0",
-            borderRadius: 30,
-          }}
-          variant="contained"
-          onClick={Write}
-        >
-          Report
-        </Button>
+        <SubmitButton variant="contained" onClick={Write}>
+          submit
+        </SubmitButton>
       </form>
     </StyledBox>
   );
@@ -459,3 +452,11 @@ const LoadingTitle = styled("div")`
     margin: 5px 0;
   }
 `;
+
+const SubmitButton = styled(Button)`
+  padding: 10px 0;
+  border-radius: 30px;
+  &:active {
+    transform: scale(0.9);
+  }
+`;