diff --git a/src/App.vue b/src/App.vue
index a02aa57ab6c06e4b36d7b12588fa934b0a85bd4d..125e2ea874dd441a7897a706376be489c1926cae 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -48,10 +48,6 @@ body {
 
   a {
     text-decoration: none;
-    .bi-box-arrow-up-right.b-icon {
-      top: -2px;
-      position: relative;
-    }
   }
 
   button.btn {
diff --git a/src/components/ExternalLink.vue b/src/components/ExternalLink.vue
new file mode 100644
index 0000000000000000000000000000000000000000..dbc64dbc1a99164334431a29e3059241d1b8e2eb
--- /dev/null
+++ b/src/components/ExternalLink.vue
@@ -0,0 +1,27 @@
+<template>
+  <b-button variant="link" :href="href" :class="{ inline }" target="_blank">
+    <slot></slot>
+    <b-icon icon="box-arrow-up-right" aria-hidden="true"></b-icon>
+  </b-button>
+</template>
+<script>
+export default {
+  props: {
+    href: String,
+    inline: Boolean
+  }
+};
+</script>
+<style lang="scss" scoped>
+a {
+  .bi-box-arrow-up-right.b-icon {
+    top: -2px;
+    position: relative;
+  }
+
+  &.inline {
+    padding: 0;
+    margin-top: -3px;
+  }
+}
+</style>