diff --git a/src/assets/defaultskin.png b/src/assets/defaultskin.png
new file mode 100644
index 00000000..d766cae0
Binary files /dev/null and b/src/assets/defaultskin.png differ
diff --git a/src/components/Avatar.vue b/src/components/Avatar.vue
index 27cd45f9..5c0688e1 100644
--- a/src/components/Avatar.vue
+++ b/src/components/Avatar.vue
@@ -1,11 +1,14 @@
 <template>
   <img
-    :src="`https://crafthead.net/helm/${key}`"
+    :src="`https://crafthead.net/helm/${key}/8`"
     :title="title && `${name}'s avatar`"
+    @error="replaceWithDefault"
   />
 </template>
 
 <script>
+import defaultSkin from '../assets/defaultskin.png';
+
 export default {
   props: {
     id: {
@@ -24,5 +27,10 @@ export default {
       return this.id.replace(/-/g, '');
     },
   },
+  methods: {
+    replaceWithDefault(e) {
+      e.target.src = defaultSkin;
+    },
+  },
 };
 </script>