diff --git a/blog/avatar.tsx b/blog/avatar.tsx
index 9c2ea4d..7a27a80 100644
--- a/blog/avatar.tsx
+++ b/blog/avatar.tsx
@@ -1,3 +1,5 @@
+import Image from "next/image";
+
 type Props = {
   name: string;
   picture: string;
@@ -6,7 +8,7 @@ type Props = {
 const Avatar = ({ name, picture }: Props) => {
   return (
     <div className="flex items-center">
-      <img src={picture} className="w-12 h-12 rounded-full mr-4" alt={name} />
+      <Image src={picture} className="w-12 h-12 rounded-full mr-4" alt={name} />
       <div className="text-xl font-bold">{name}</div>
     </div>
   );