diff --git a/src/components/item_card/SkillTag.vue b/src/components/item_card/SkillTag.vue
index 07fe818..5313e9b 100644
--- a/src/components/item_card/SkillTag.vue
+++ b/src/components/item_card/SkillTag.vue
@@ -1,11 +1,42 @@
 <template>
-
+  <span class="tag is-info">
+    <span class="icon">
+      <farming-icon v-if="skill === 'farming'"/>
+      <mining-icon v-if="skill === 'mining'"/>
+      <foraging-icon v-if="skill === 'foraging'"/>
+      <fishing-icon v-if="skill === 'fishing'"/>
+      <combat-icon v-if="skill === 'combat'"/>
+    </span>
+  </span>
 </template>
 
 <script>
-    export default {
-        name: "skill-tag"
+import Skills from '@/assets/game_data/skills.json'
+import FarmingIcon from 'mdi-vue/CowIcon'
+import MiningIcon from 'mdi-vue/DiamondIcon'
+import ForagingIcon from 'mdi-vue/MushroomIcon'
+import FishingIcon from 'mdi-vue/FishIcon'
+import CombatIcon from 'mdi-vue/SwordIcon'
+export default {
+  name: 'skill-tag',
+  props: {
+    skill: {
+      type: String,
+      required: true,
+      default: 'farming',
+      validator: function (value) {
+        return value.toLowerCase() in Skills
+      }
     }
+  },
+  components: {
+    FarmingIcon,
+    MiningIcon,
+    ForagingIcon,
+    FishingIcon,
+    CombatIcon
+  }
+}
 </script>
 
 <style scoped>