diff --git a/README.md b/README.md
index 4d4108a..5b830ed 100644
--- a/README.md
+++ b/README.md
@@ -31,8 +31,8 @@
 
 |Preview|Preview|
 |---|---|
-|![theme-dark](./website/static/readme/noi-theme-dark.png)|![noi-settings](./website/static/readme/noi-settings.png)|
-|![settings-prompts](./website/static/readme/noi-prompt.png)|![batch-ask](./website/static/readme/noi-prompt-use.png)|
+|![theme-dark](./website/static/readme/noi-theme-dark.jpg)|![noi-settings](./website/static/readme/noi-settings.jpg)|
+|![settings-prompts](./website/static/readme/noi-prompt.jpg)|![batch-ask](./website/static/readme/noi-prompt-use.jpg)|
 
 ---
 
@@ -48,7 +48,7 @@ If you encounter the error message "Noi" is damaged and can't be opened. You sho
 xattr -cr /Applications/Noi.app
 ```
 
-![mac-install-error](./website/static/readme/mac-install-error.png)
+![mac-install-error](./website/static/readme/mac-install-error.jpg)
 
 ## TODO
 
diff --git a/configs/README.md b/configs/README.md
index e61e22d..047062e 100644
--- a/configs/README.md
+++ b/configs/README.md
@@ -11,7 +11,7 @@ To set up a custom sync link, follow the steps below:
 > [!NOTE]
 > The `custom url` will not be overwritten. If you wish to use your own URL as a data source, please refer to the data format in `noi.mode.json`.
 
-![Mode Sync](../website/static/configs/mode-sync.png)
+![Mode Sync](../website/static/configs/mode-sync.jpg)
 
 ### Sync URL
 
diff --git a/website/src/pages/index.tsx b/website/src/pages/index.tsx
index 52e31b1..beedd1e 100644
--- a/website/src/pages/index.tsx
+++ b/website/src/pages/index.tsx
@@ -5,7 +5,7 @@ import Layout from '@theme/Layout';
 const noiVersion = '0.3.0';
 
 export default function Home(): JSX.Element {
-  const {siteConfig} = useDocusaurusContext();
+  const { siteConfig } = useDocusaurusContext();
   return (
     <Layout
       title="Home"
@@ -43,10 +43,10 @@ export default function Home(): JSX.Element {
 
         <h2 className="mt-5">Preview</h2>
         <div className="grid sm:grid-cols-1 lg:grid-cols-2 gap-4 max-w-[960px] m-auto">
-          <img className="rounded-lg shadow-lg" src="/readme/noi-theme-dark.png" />
-          <img className="rounded-lg shadow-lg" src="/readme/noi-settings.png" />
-          <img className="rounded-lg shadow-lg" src="/readme/noi-prompt.png" />
-          <img className="rounded-lg shadow-lg" src="/readme/noi-prompt-use.png" />
+          <img className="rounded-lg shadow-lg" src="/readme/noi-theme-dark.jpg" />
+          <img className="rounded-lg shadow-lg" src="/readme/noi-settings.jpg" />
+          <img className="rounded-lg shadow-lg" src="/readme/noi-prompt.jpg" />
+          <img className="rounded-lg shadow-lg" src="/readme/noi-prompt-use.jpg" />
         </div>
 
         <h2 className="mt-5">FAQ</h2>
diff --git a/website/static/configs/mode-sync.jpg b/website/static/configs/mode-sync.jpg
new file mode 100644
index 0000000..eeac54a
Binary files /dev/null and b/website/static/configs/mode-sync.jpg differ
diff --git a/website/static/configs/mode-sync.png b/website/static/configs/mode-sync.png
deleted file mode 100644
index ac20c5d..0000000
Binary files a/website/static/configs/mode-sync.png and /dev/null differ
diff --git a/website/static/readme/mac-install-error.jpg b/website/static/readme/mac-install-error.jpg
new file mode 100644
index 0000000..b5049f7
Binary files /dev/null and b/website/static/readme/mac-install-error.jpg differ
diff --git a/website/static/readme/mac-install-error.png b/website/static/readme/mac-install-error.png
deleted file mode 100644
index fc8a20c..0000000
Binary files a/website/static/readme/mac-install-error.png and /dev/null differ
diff --git a/website/static/readme/noi-prompt-use.jpg b/website/static/readme/noi-prompt-use.jpg
new file mode 100644
index 0000000..3e8d1d5
Binary files /dev/null and b/website/static/readme/noi-prompt-use.jpg differ
diff --git a/website/static/readme/noi-prompt-use.png b/website/static/readme/noi-prompt-use.png
deleted file mode 100644
index 45cfe4c..0000000
Binary files a/website/static/readme/noi-prompt-use.png and /dev/null differ
diff --git a/website/static/readme/noi-prompt.jpg b/website/static/readme/noi-prompt.jpg
new file mode 100644
index 0000000..9e6185f
Binary files /dev/null and b/website/static/readme/noi-prompt.jpg differ
diff --git a/website/static/readme/noi-prompt.png b/website/static/readme/noi-prompt.png
deleted file mode 100644
index 189b706..0000000
Binary files a/website/static/readme/noi-prompt.png and /dev/null differ
diff --git a/website/static/readme/noi-settings.jpg b/website/static/readme/noi-settings.jpg
new file mode 100644
index 0000000..ba1f349
Binary files /dev/null and b/website/static/readme/noi-settings.jpg differ
diff --git a/website/static/readme/noi-settings.png b/website/static/readme/noi-settings.png
deleted file mode 100644
index 94881c5..0000000
Binary files a/website/static/readme/noi-settings.png and /dev/null differ
diff --git a/website/static/readme/noi-theme-dark.jpg b/website/static/readme/noi-theme-dark.jpg
new file mode 100644
index 0000000..5a71d8b
Binary files /dev/null and b/website/static/readme/noi-theme-dark.jpg differ
diff --git a/website/static/readme/noi-theme-dark.png b/website/static/readme/noi-theme-dark.png
deleted file mode 100644
index a0e386a..0000000
Binary files a/website/static/readme/noi-theme-dark.png and /dev/null differ