diff --git a/apps/website/public/collection_board.png b/apps/website/public/collection_board.png
deleted file mode 100644
index 8cbc1a72c9..0000000000
Binary files a/apps/website/public/collection_board.png and /dev/null differ
diff --git a/apps/website/public/collection_board.webp b/apps/website/public/collection_board.webp
new file mode 100644
index 0000000000..6ed49dd449
Binary files /dev/null and b/apps/website/public/collection_board.webp differ
diff --git a/apps/website/public/collection_calendar.png b/apps/website/public/collection_calendar.png
deleted file mode 100644
index 0d6a4fa815..0000000000
Binary files a/apps/website/public/collection_calendar.png and /dev/null differ
diff --git a/apps/website/public/collection_calendar.webp b/apps/website/public/collection_calendar.webp
new file mode 100644
index 0000000000..34b7961e0f
Binary files /dev/null and b/apps/website/public/collection_calendar.webp differ
diff --git a/apps/website/public/collection_geomap.png b/apps/website/public/collection_geomap.png
deleted file mode 100644
index cd891b6465..0000000000
Binary files a/apps/website/public/collection_geomap.png and /dev/null differ
diff --git a/apps/website/public/collection_geomap.webp b/apps/website/public/collection_geomap.webp
new file mode 100644
index 0000000000..e564fbfc6f
Binary files /dev/null and b/apps/website/public/collection_geomap.webp differ
diff --git a/apps/website/public/collection_table.png b/apps/website/public/collection_table.png
deleted file mode 100644
index b23b4c4685..0000000000
Binary files a/apps/website/public/collection_table.png and /dev/null differ
diff --git a/apps/website/public/collection_table.webp b/apps/website/public/collection_table.webp
new file mode 100644
index 0000000000..2113caf65f
Binary files /dev/null and b/apps/website/public/collection_table.webp differ
diff --git a/apps/website/public/screenshot_desktop_mac_dark.png b/apps/website/public/screenshot_desktop_mac_dark.png
deleted file mode 100644
index 2eae66f18a..0000000000
Binary files a/apps/website/public/screenshot_desktop_mac_dark.png and /dev/null differ
diff --git a/apps/website/public/screenshot_desktop_mac_dark.webp b/apps/website/public/screenshot_desktop_mac_dark.webp
new file mode 100644
index 0000000000..347838682f
Binary files /dev/null and b/apps/website/public/screenshot_desktop_mac_dark.webp differ
diff --git a/apps/website/public/screenshot_desktop_mac_light.png b/apps/website/public/screenshot_desktop_mac_light.png
deleted file mode 100644
index a2b64b7fba..0000000000
Binary files a/apps/website/public/screenshot_desktop_mac_light.png and /dev/null differ
diff --git a/apps/website/public/screenshot_desktop_mac_light.webp b/apps/website/public/screenshot_desktop_mac_light.webp
new file mode 100644
index 0000000000..2415bbd3ff
Binary files /dev/null and b/apps/website/public/screenshot_desktop_mac_light.webp differ
diff --git a/apps/website/public/screenshot_desktop_win_dark.png b/apps/website/public/screenshot_desktop_win_dark.png
deleted file mode 100644
index c35e2a8b54..0000000000
Binary files a/apps/website/public/screenshot_desktop_win_dark.png and /dev/null differ
diff --git a/apps/website/public/screenshot_desktop_win_dark.webp b/apps/website/public/screenshot_desktop_win_dark.webp
new file mode 100644
index 0000000000..051d8f1c22
Binary files /dev/null and b/apps/website/public/screenshot_desktop_win_dark.webp differ
diff --git a/apps/website/public/screenshot_desktop_win_light.png b/apps/website/public/screenshot_desktop_win_light.png
deleted file mode 100644
index fa4e225f0a..0000000000
Binary files a/apps/website/public/screenshot_desktop_win_light.png and /dev/null differ
diff --git a/apps/website/public/screenshot_desktop_win_light.webp b/apps/website/public/screenshot_desktop_win_light.webp
new file mode 100644
index 0000000000..a44801ea3b
Binary files /dev/null and b/apps/website/public/screenshot_desktop_win_light.webp differ
diff --git a/apps/website/public/type_canvas.png b/apps/website/public/type_canvas.png
deleted file mode 100644
index ad5c74b363..0000000000
Binary files a/apps/website/public/type_canvas.png and /dev/null differ
diff --git a/apps/website/public/type_canvas.webp b/apps/website/public/type_canvas.webp
new file mode 100644
index 0000000000..839818606a
Binary files /dev/null and b/apps/website/public/type_canvas.webp differ
diff --git a/apps/website/public/type_code.png b/apps/website/public/type_code.png
deleted file mode 100644
index 89841cdeb5..0000000000
Binary files a/apps/website/public/type_code.png and /dev/null differ
diff --git a/apps/website/public/type_code.webp b/apps/website/public/type_code.webp
new file mode 100644
index 0000000000..91816541a7
Binary files /dev/null and b/apps/website/public/type_code.webp differ
diff --git a/apps/website/public/type_file.png b/apps/website/public/type_file.png
deleted file mode 100644
index e57ba1c4d3..0000000000
Binary files a/apps/website/public/type_file.png and /dev/null differ
diff --git a/apps/website/public/type_file.webp b/apps/website/public/type_file.webp
new file mode 100644
index 0000000000..6423d4fc43
Binary files /dev/null and b/apps/website/public/type_file.webp differ
diff --git a/apps/website/public/type_mermaid.png b/apps/website/public/type_mermaid.png
deleted file mode 100644
index 1e8bd73866..0000000000
Binary files a/apps/website/public/type_mermaid.png and /dev/null differ
diff --git a/apps/website/public/type_mermaid.webp b/apps/website/public/type_mermaid.webp
new file mode 100644
index 0000000000..c7c7eb3c6e
Binary files /dev/null and b/apps/website/public/type_mermaid.webp differ
diff --git a/apps/website/public/type_mindmap.png b/apps/website/public/type_mindmap.png
deleted file mode 100644
index a970d485ff..0000000000
Binary files a/apps/website/public/type_mindmap.png and /dev/null differ
diff --git a/apps/website/public/type_mindmap.webp b/apps/website/public/type_mindmap.webp
new file mode 100644
index 0000000000..23addc0658
Binary files /dev/null and b/apps/website/public/type_mindmap.webp differ
diff --git a/apps/website/public/type_text.png b/apps/website/public/type_text.png
deleted file mode 100644
index a6708c3cf6..0000000000
Binary files a/apps/website/public/type_text.png and /dev/null differ
diff --git a/apps/website/public/type_text.webp b/apps/website/public/type_text.webp
new file mode 100644
index 0000000000..dd897dbca4
Binary files /dev/null and b/apps/website/public/type_text.webp differ
diff --git a/apps/website/src/pages/Home/index.tsx b/apps/website/src/pages/Home/index.tsx
index 47c933a5d3..2302a32b40 100644
--- a/apps/website/src/pages/Home/index.tsx
+++ b/apps/website/src/pages/Home/index.tsx
@@ -56,13 +56,13 @@ function HeroSection() {
 
     switch (platform) {
         case "macos":
-            screenshotUrl = `/screenshot_desktop_mac_${colorScheme}.png`;
+            screenshotUrl = `/screenshot_desktop_mac_${colorScheme}.webp`;
             break;
         case "linux":
             break;
         case "windows":
         default:
-            screenshotUrl = `/screenshot_desktop_win_${colorScheme}.png`;
+            screenshotUrl = `/screenshot_desktop_win_${colorScheme}.webp`;
             break;
     }
 
@@ -126,42 +126,42 @@ function NoteTypesSection() {
             <ListWithScreenshot horizontal items={[
                 {
                     title: "Text notes",
-                    imageUrl: "/type_text.png",
+                    imageUrl: "/type_text.webp",
                     iconSvg: textNoteIcon,
                     moreInfo: "https://docs.triliumnotes.org/User%20Guide/User%20Guide/Note%20Types/Text/index.html",
                     description: "The notes are edited using a visual (WYSIWYG) editor, with support for tables, images, math expressions, code blocks with syntax highlighting. Quickly format the text using Markdown-like syntax or using slash commands."
                 },
                 {
                     title: "Code notes",
-                    imageUrl: "/type_code.png",
+                    imageUrl: "/type_code.webp",
                     iconSvg: codeIcon,
                     moreInfo: "https://docs.triliumnotes.org/User%20Guide/User%20Guide/Note%20Types/Code.html",
                     description: "Large samples of source code or scripts use a dedicated editor, with syntax highlighting for many programming languages and with various color themes."
                 },
                 {
                     title: "File notes",
-                    imageUrl: "/type_file.png",
+                    imageUrl: "/type_file.webp",
                     iconSvg: fileIcon,
                     moreInfo: "https://docs.triliumnotes.org/User%20Guide/User%20Guide/Note%20Types/File.html",
                     description: "Embed multimedia files such as PDFs, images, videos with an in-application preview."
                 },
                 {
                     title: "Canvas",
-                    imageUrl: "/type_canvas.png",
+                    imageUrl: "/type_canvas.webp",
                     iconSvg: canvasIcon,
                     moreInfo: "https://docs.triliumnotes.org/User%20Guide/User%20Guide/Note%20Types/Canvas.html",
                     description: "Arrange shapes, images and text across an infinite canvas, using the same technology behind excalidraw.com. Ideal for diagrams, sketches and visual planning."
                 },
                 {
                     title: "Mermaid diagrams",
-                    imageUrl: "/type_mermaid.png",
+                    imageUrl: "/type_mermaid.webp",
                     iconSvg: mermaidIcon,
                     moreInfo: "https://docs.triliumnotes.org/User%20Guide/User%20Guide/Note%20Types/Mermaid%20Diagrams/index.html",
                     description: "Create diagrams such as flowcharts, class & sequence diagrams, Gantt charts and many more, using the Mermaid syntax."
                 },
                 {
                     title: "Mindmap",
-                    imageUrl: "/type_mindmap.png",
+                    imageUrl: "/type_mindmap.webp",
                     iconSvg: mindmapIcon,
                     moreInfo: "https://docs.triliumnotes.org/User%20Guide/User%20Guide/Note%20Types/Mind%20Map.html",
                     description: "Organize your thoughts visually or do a brainstorming session."
@@ -200,7 +200,7 @@ function CollectionsSection() {
             <ListWithScreenshot items={[
                 {
                     title: "Calendar",
-                    imageUrl: "/collection_calendar.png",
+                    imageUrl: "/collection_calendar.webp",
                     iconSvg: calendarIcon,
                     moreInfo: "https://docs.triliumnotes.org/User%20Guide/User%20Guide/Note%20Types/Collections/Calendar%20View.html",
                     description: "Organize your personal or professional events using a calendar, with support for all-day and multi-day events. See your events at a glance with the week, month and year views. Easy interaction to add or drag events."
@@ -208,20 +208,20 @@ function CollectionsSection() {
                 {
                     title: "Table",
                     iconSvg: tableIcon,
-                    imageUrl: "/collection_table.png",
+                    imageUrl: "/collection_table.webp",
                     moreInfo: "https://docs.triliumnotes.org/User%20Guide/User%20Guide/Note%20Types/Collections/Table%20View.html",
                     description: "Display and edit information about notes in a tabular structure, with various column types such as text, number, check boxes, date & time, links and colors and support for relations. Optionally, display the notes within a tree hierarchy inside the table." },
                 {
                     title: "Board",
                     iconSvg: boardIcon,
-                    imageUrl: "/collection_board.png",
+                    imageUrl: "/collection_board.webp",
                     moreInfo: "https://docs.triliumnotes.org/User%20Guide/User%20Guide/Note%20Types/Collections/Board%20View.html",
                     description: "Organize your tasks or project status into a Kanban board with an easy way to create new items and columns and simply changing their status by dragging across the board."
                 },
                 {
                     title: "Geomap",
                     iconSvg: geomapIcon,
-                    imageUrl: "/collection_geomap.png",
+                    imageUrl: "/collection_geomap.webp",
                     moreInfo: "https://docs.triliumnotes.org/User%20Guide/User%20Guide/Note%20Types/Collections/Geo%20Map%20View.html",
                     description: "Plan your vacations or mark your points of interest directly on a geographical map using customizable markers. Display recorded GPX tracks to track itineraries."
                 }