diff --git a/src/pages/download/index.tsx b/src/pages/download/index.tsx
index 54f1778..270cf9e 100644
--- a/src/pages/download/index.tsx
+++ b/src/pages/download/index.tsx
@@ -4,7 +4,7 @@ import TabItem from "@theme/TabItem";
 import { faTowerCell, faFileZipper } from '@fortawesome/free-solid-svg-icons';
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
 import HeroBanner from '@site/src/components/HeroBanner';
-import HeroBackground from '@site/static/img/site/split-background.jpg';
+import HeroBackground from '@site/static/img/site/split-background.webp';
 import PaperSpigotIcon from '@site/static/img/icons/paper.png';
 import VelocityIcon from '@site/static/img/icons/velocity.png';
 import WaterfallBungeeCordIcon from '@site/static/img/icons/waterfall.svg';
diff --git a/src/pages/index.module.css b/src/pages/index.module.css
index 3938d9e..c25d19b 100644
--- a/src/pages/index.module.css
+++ b/src/pages/index.module.css
@@ -1,9 +1,9 @@
 :root {
-    --ifm-background-image-url: url('/img/site/split-background-light.jpg');
+    --ifm-background-image-url: url('/img/site/split-background-light.webp');
 }
 
 [data-theme='dark'] {
-    --ifm-background-image-url: url('/img/site/split-background.jpg') !important;
+    --ifm-background-image-url: url('/img/site/split-background.webp') !important;
 }
 
 .heroBanner {
diff --git a/src/pages/utilities/config-editor.tsx b/src/pages/utilities/config-editor.tsx
index 3e41686..3280271 100644
--- a/src/pages/utilities/config-editor.tsx
+++ b/src/pages/utilities/config-editor.tsx
@@ -1,6 +1,6 @@
 import Translate from '@docusaurus/Translate';
 import HeroBanner from '@site/src/components/HeroBanner';
-import HeroBackground from '@site/static/img/site/split-background.jpg';
+import HeroBackground from '@site/static/img/site/split-background.webp';
 import Layout from '@theme/Layout';
 import styles from './utilities.module.css';
 import { useRef, useState } from 'react';
diff --git a/src/pages/utilities/dump-viewer.tsx b/src/pages/utilities/dump-viewer.tsx
index 8d93692..0c022b0 100644
--- a/src/pages/utilities/dump-viewer.tsx
+++ b/src/pages/utilities/dump-viewer.tsx
@@ -1,6 +1,6 @@
 import Translate from '@docusaurus/Translate';
 import HeroBanner from '@site/src/components/HeroBanner';
-import HeroBackground from '@site/static/img/site/split-background.jpg';
+import HeroBackground from '@site/static/img/site/split-background.webp';
 import Layout from '@theme/Layout';
 import { useEffect, useRef, useState } from 'react';
 import styles from './utilities.module.css';
diff --git a/static/img/site/index.d.ts b/static/img/site/index.d.ts
index e871b0b..6a6bf66 100644
--- a/static/img/site/index.d.ts
+++ b/static/img/site/index.d.ts
@@ -6,4 +6,9 @@ declare module '*.png' {
 declare module '*.jpg' {
     const value: any;
     export = value;
+}
+
+declare module '*.webp' {
+    const value: any;
+    export = value;
 }
\ No newline at end of file
diff --git a/static/img/site/split-background-light.webp b/static/img/site/split-background-light.webp
new file mode 100644
index 0000000..a638cc6
Binary files /dev/null and b/static/img/site/split-background-light.webp differ
diff --git a/static/img/site/split-background.webp b/static/img/site/split-background.webp
new file mode 100644
index 0000000..28ff0c2
Binary files /dev/null and b/static/img/site/split-background.webp differ