diff --git a/src/components/widgets/AutocompleteWidget/AutocompleteWidget.tsx b/src/components/widgets/AutocompleteWidget/AutocompleteWidget.tsx
index 63926ca4..229c0167 100644
--- a/src/components/widgets/AutocompleteWidget/AutocompleteWidget.tsx
+++ b/src/components/widgets/AutocompleteWidget/AutocompleteWidget.tsx
@@ -10,11 +10,14 @@ import {
   EuiHighlight,
   EuiHealth,
   EuiProvider,
-  EuiIcon
+  EuiIcon,
+  EuiPanel,
+  EuiFlexGroup
 } from "@elastic/eui";
 import { QueryClient, QueryClientProvider, useQuery } from "react-query";
 import { AutocompleteWidgetProps } from "../../../app/types";
 import { BreadcrumbPresentation } from "../MetadataWidget/BreadcrumbWidget/BreadcrumbPresentation";
+import { MetadataWidget } from "../MetadataWidget";
 
 /**
  * A React component to provide Autosuggestion based on SemLookP.
@@ -211,6 +214,19 @@ function AutocompleteWidget(props: AutocompleteWidgetProps) {
     }
   );
 
+  const createToolTipContent = (iri) =>
+    <EuiFlexGroup style={{ color: "black" }}>
+      <EuiPanel>
+        <MetadataWidget
+          api={api}
+          iri={iri}
+          hierarchyTab={false}
+          crossRefTab={false}
+          terminologyInfoTab={false}
+        />
+      </EuiPanel>
+    </EuiFlexGroup>
+
   /**
    * fetches new options when searchValue changes
    */
@@ -247,7 +263,13 @@ function AutocompleteWidget(props: AutocompleteWidgetProps) {
                   short_form: selection.getShortForm(),
                   description: selection.getDescription(),
                   source: selection.getApiSourceName(),
-                  source_url: selection.getApiSourceEndpoint()
+                  source_url: selection.getApiSourceEndpoint(),
+                },
+                toolTipContent: createToolTipContent(
+                  selection.getIri()
+                ),
+                toolTipProps: {
+                  css: {maxWidth: "none", maxHeight: "none"},
                 }
               })
             ));
diff --git a/src/components/widgets/MetadataWidget/MetadataWidget.tsx b/src/components/widgets/MetadataWidget/MetadataWidget.tsx
index 9e112028..65856fdf 100644
--- a/src/components/widgets/MetadataWidget/MetadataWidget.tsx
+++ b/src/components/widgets/MetadataWidget/MetadataWidget.tsx
@@ -111,16 +111,20 @@ function MetadataWidget(props: MetadataWidgetProps) {
               </EuiFlexItem>
             </EuiFlexGroup>
           </EuiFlexItem>
+          {data.entity.getDescription() &&
           <EuiFlexItem style={{ maxWidth: 600 }}>
             <DescriptionPresentation
               description={data.entity.getDescription()}
             />
           </EuiFlexItem>
+          }
 
+          {data.ontoList && data.ontoList.length > 0 &&
           <div style={{margin: "0 12px 0", maxWidth: 600 }}>
               <EntityOntoListPresentation iri={props.iri} label={data.entity.getLabel() || ""} ontolist={data.ontoList} entityType={entityType || data.entity.getType() as EntityTypeName} onNavigateToOntology={onNavigateToOntology} />
               <EntityDefinedByPresentation iri={props.iri} ontolist={data.definedBy} label={data.entity.getLabel() || ""} entityType={entityType || data.entity.getType() as EntityTypeName} onNavigateToOntology={onNavigateToOntology} />
           </div>
+          }
 
           <EuiFlexItem>
               <TabPresentation