diff --git a/client/src/components/AvailableDatatypes.vue b/client/src/components/AvailableDatatypes.vue
index a8dcfb7bba5..7724806a42a 100644
--- a/client/src/components/AvailableDatatypes.vue
+++ b/client/src/components/AvailableDatatypes.vue
@@ -40,7 +40,15 @@ const edamLink = (edamIRI) => `https://edamontology.github.io/edam-browser/#${ed
         <DelayedInput placeholder="filter extensions" class="mb-3" :delay="200" @change="(val) => (filter = val)" />
         <b-table striped small sort-icon-left sort-by="extension" :items="filteredDatatypes" :fields="fields">
             <template v-slot:cell(extension)="row">
-                <span v-b-tooltip.hover :title="row.item.description">
+                <a
+                    v-if="row.item.descriptionUrl"
+                    v-b-tooltip.hover
+                    target="_blank"
+                    :title="row.item.description"
+                    :href="row.item.descriptionUrl">
+                    {{ row.item.extension }}
+                </a>
+                <span v-else v-b-tooltip.hover :title="row.item.description">
                     {{ row.item.extension }}
                 </span>
             </template>
diff --git a/client/src/composables/datatypes.js b/client/src/composables/datatypes.js
index e9b71b467bd..15aa61ce8cd 100644
--- a/client/src/composables/datatypes.js
+++ b/client/src/composables/datatypes.js
@@ -29,6 +29,7 @@ export function useDetailedDatatypes() {
                 return {
                     extension: type.extension,
                     description: type.description,
+                    descriptionUrl: type.description_url,
                     edamFormat: typeEDAMFormat.prefix_IRI,
                     edamFormatLabel: typeEDAMFormat.label,
                     edamFormatDefinition: typeEDAMFormat.definition,