diff --git a/packages/website/src/pages/[...chunk_api]/flags/fade/[id].webp.ts b/packages/website/src/pages/[...chunk_api]/flags/fade/[id].webp.ts
new file mode 100644
index 000000000..e31a8ede0
--- /dev/null
+++ b/packages/website/src/pages/[...chunk_api]/flags/fade/[id].webp.ts
@@ -0,0 +1,35 @@
+import type { APIContext, GetStaticPathsItem } from "astro";
+import { mixStaticPaths } from "../../../../core/blitzkit/mixStaticPaths";
+import { vfs } from "../../../../core/blitzkit/vfs";
+import { getStaticPaths as _getStaticPaths } from "../../_index";
+
+export const getStaticPaths = mixStaticPaths(_getStaticPaths, async () => {
+  const paths: GetStaticPathsItem[] = [];
+
+  const fadedFiles = await vfs
+    .dir(`Data/Gfx/Lobby/flags`)
+    .then((files) =>
+      files.filter(
+        (flag) =>
+          flag.startsWith("flag_filter_") && flag.endsWith("@2x.packed.webp"),
+      ),
+    );
+
+  for (const flag of fadedFiles) {
+    const path = `Data/Gfx/Lobby/flags/${flag}`;
+    const id = flag.match(/flag_filter_(.+)@2x\.packed\.webp/)![1];
+
+    paths.push({
+      params: { id },
+      props: { path },
+    });
+  }
+
+  return paths;
+});
+
+export async function GET({ props }: APIContext<{ path: string }>) {
+  const bytes = new Uint8Array(await vfs.file(props.path));
+
+  return new Response(bytes);
+}
diff --git a/packages/website/src/pages/[...chunk_api]/flags/scratched/[id].webp.ts b/packages/website/src/pages/[...chunk_api]/flags/scratched/[id].webp.ts
index c56db0a06..9edbdf433 100644
--- a/packages/website/src/pages/[...chunk_api]/flags/scratched/[id].webp.ts
+++ b/packages/website/src/pages/[...chunk_api]/flags/scratched/[id].webp.ts
@@ -32,9 +32,5 @@ export const getStaticPaths = mixStaticPaths(_getStaticPaths, async () => {
 export async function GET({ props }: APIContext<{ path: string }>) {
   const bytes = new Uint8Array(await vfs.file(props.path));
 
-  return new Response(bytes, {
-    headers: {
-      "Content-Type": "image/webp",
-    },
-  });
+  return new Response(bytes);
 }