diff --git a/packages/website/components/ThemedImage.tsx b/packages/website/components/ThemedImage.tsx
index 915ea19cd35..2e304892265 100644
--- a/packages/website/components/ThemedImage.tsx
+++ b/packages/website/components/ThemedImage.tsx
@@ -1,6 +1,7 @@
+import { useEffect, useState } from "react";
+
import Image from "next/image";
import { useTheme } from "next-themes";
-import { useEffect, useState } from "react";
function ThemedImage() {
const { resolvedTheme } = useTheme();
@@ -9,8 +10,8 @@ function ThemedImage() {
useEffect(() => {
setSrc(
resolvedTheme === "dark"
- ? "/images/logotype-white.png"
- : "/images/logotype-black.png"
+ ? "/images/logotype-white.svg"
+ : "/images/logotype-black.svg"
);
}, [resolvedTheme]);
@@ -20,7 +21,7 @@ function ThemedImage() {
width={100}
height={100}
alt="logo"
- style={{ width: "100%", height: "auto" }}
+ style={{ width: "128px", height: "auto" }}
/>
) : null;
}
diff --git a/packages/website/public/images/logotype-black.png b/packages/website/public/images/logotype-black.png
deleted file mode 100644
index 426a8ba2c2a..00000000000
Binary files a/packages/website/public/images/logotype-black.png and /dev/null differ
diff --git a/packages/website/public/images/logotype-black.svg b/packages/website/public/images/logotype-black.svg
new file mode 100644
index 00000000000..07be42d8fa5
--- /dev/null
+++ b/packages/website/public/images/logotype-black.svg
@@ -0,0 +1,8 @@
+
diff --git a/packages/website/public/images/logotype-white.png b/packages/website/public/images/logotype-white.png
deleted file mode 100644
index 9692503c9ad..00000000000
Binary files a/packages/website/public/images/logotype-white.png and /dev/null differ
diff --git a/packages/website/public/images/logotype-white.svg b/packages/website/public/images/logotype-white.svg
new file mode 100644
index 00000000000..74b63e542e9
--- /dev/null
+++ b/packages/website/public/images/logotype-white.svg
@@ -0,0 +1,8 @@
+