diff --git a/src/frontend/package-lock.json b/src/frontend/package-lock.json
index a9298c48..71d8ea31 100644
--- a/src/frontend/package-lock.json
+++ b/src/frontend/package-lock.json
@@ -6580,6 +6580,11 @@
       "integrity": "sha1-HADHQ7QzzQpOgHWPe2SldEDZ/wA=",
       "dev": true
     },
+    "linkifyjs": {
+      "version": "2.1.9",
+      "resolved": "https://registry.npmjs.org/linkifyjs/-/linkifyjs-2.1.9.tgz",
+      "integrity": "sha512-74ivurkK6WHvHFozVaGtQWV38FzBwSTGNmJolEgFp7QgR2bl6ArUWlvT4GcHKbPe1z3nWYi+VUdDZk16zDOVug=="
+    },
     "loader-fs-cache": {
       "version": "1.0.3",
       "resolved": "https://registry.npmjs.org/loader-fs-cache/-/loader-fs-cache-1.0.3.tgz",
@@ -10930,6 +10935,15 @@
       "resolved": "https://registry.npmjs.org/vue-infinite-loading/-/vue-infinite-loading-2.4.5.tgz",
       "integrity": "sha512-xhq95Mxun060bRnsOoLE2Be6BR7jYwuC89kDe18+GmCLVrRA/dU0jrGb12Xu6NjmKs+iTW0AA6saSEmEW4cR7g=="
     },
+    "vue-linkify": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/vue-linkify/-/vue-linkify-1.0.1.tgz",
+      "integrity": "sha1-LGIYGXjvHGXYdNmxVkeVMdZjDLM=",
+      "requires": {
+        "linkifyjs": "^2.1.3",
+        "vue": "^2.1.6"
+      }
+    },
     "vue-loader": {
       "version": "15.9.3",
       "resolved": "https://registry.npmjs.org/vue-loader/-/vue-loader-15.9.3.tgz",
diff --git a/src/frontend/package.json b/src/frontend/package.json
index 56b2474e..7ada91f5 100644
--- a/src/frontend/package.json
+++ b/src/frontend/package.json
@@ -19,6 +19,7 @@
     "vue-axios": "^2.1.5",
     "vue-chartjs": "^3.5.0",
     "vue-infinite-loading": "^2.4.5",
+    "vue-linkify": "^1.0.1",
     "vue-moment": "^4.1.0",
     "vue-router": "^3.2.0",
     "vuetify": "^2.2.11",
diff --git a/src/frontend/src/components/card/Card.vue b/src/frontend/src/components/card/Card.vue
index 9d4a8c04..737c05e2 100644
--- a/src/frontend/src/components/card/Card.vue
+++ b/src/frontend/src/components/card/Card.vue
@@ -13,11 +13,11 @@
           </v-flex>
         </v-layout>
       </v-card-title>
-
       <v-card-text
         class="headline text-body-1 pb-0"
         style="color:rgb(0,0,0)"
         v-html="article.content.replace(/(?:\r\n|\r|\n)/g, '<br />')"
+        v-linkified
       >
       </v-card-text>
 
@@ -83,6 +83,7 @@ import { REPORT_TYPE } from '@/utils/ReportType.js';
 
 import { mapActions } from 'vuex';
 import { LIKE_ARTICLE, UNLIKE_ARTICLE } from '@/store/shared/actionTypes';
+import linkify from 'vue-linkify';
 
 export default {
   name: 'Card',
@@ -93,6 +94,9 @@ export default {
     ReportButton,
     DetailCardMenu
   },
+  directives: {
+    linkified: linkify
+  },
   methods: {
     ...mapActions([LIKE_ARTICLE, UNLIKE_ARTICLE]),
     toggleLike() {