diff --git a/src/plugins/vis_type_markdown/kibana.jsonc b/src/plugins/vis_type_markdown/kibana.jsonc
index d3d1d3bd9f29b..476dcc0605ad4 100644
--- a/src/plugins/vis_type_markdown/kibana.jsonc
+++ b/src/plugins/vis_type_markdown/kibana.jsonc
@@ -13,6 +13,7 @@
     ],
     "requiredBundles": [
       "expressions",
+      "kibanaReact",
       "visDefaultEditor",
       "visualizations"
     ]
diff --git a/src/plugins/vis_type_markdown/public/markdown_vis_controller.test.tsx b/src/plugins/vis_type_markdown/public/markdown_vis_controller.test.tsx
index 04f86e815e841..963f3b0ecbbb2 100644
--- a/src/plugins/vis_type_markdown/public/markdown_vis_controller.test.tsx
+++ b/src/plugins/vis_type_markdown/public/markdown_vis_controller.test.tsx
@@ -29,9 +29,7 @@ describe('markdown vis controller', () => {
 
     expect(getByText('markdown')).toMatchInlineSnapshot(`
       <a
-        class="euiLink emotion-euiLink-primary"
         href="http://daringfireball.net/projects/markdown"
-        rel="noreferrer"
       >
         markdown
       </a>
@@ -55,8 +53,7 @@ describe('markdown vis controller', () => {
 
     expect(getByText(/testing/i)).toMatchInlineSnapshot(`
       <p>
-        Testing 
-        html
+        Testing &lt;a&gt;html&lt;/a&gt;
       </p>
     `);
   });
diff --git a/src/plugins/vis_type_markdown/public/markdown_vis_controller.tsx b/src/plugins/vis_type_markdown/public/markdown_vis_controller.tsx
index 7c0b44d24860d..d941adf573591 100644
--- a/src/plugins/vis_type_markdown/public/markdown_vis_controller.tsx
+++ b/src/plugins/vis_type_markdown/public/markdown_vis_controller.tsx
@@ -7,7 +7,7 @@
  */
 
 import React, { useEffect } from 'react';
-import { Markdown } from '@kbn/shared-ux-markdown';
+import { Markdown } from '@kbn/kibana-react-plugin/public';
 import { MarkdownVisParams } from './types';
 
 import './markdown_vis.scss';
@@ -29,8 +29,7 @@ const MarkdownVisComponent = ({
       <Markdown
         data-test-subj="markdownBody"
         openLinksInNewTab={openLinksInNewTab}
-        markdownContent={markdown || ` `}
-        readOnly
+        markdown={markdown}
       />
     </div>
   );
diff --git a/test/functional/apps/dashboard_elements/markdown/_markdown_vis.ts b/test/functional/apps/dashboard_elements/markdown/_markdown_vis.ts
index d524fd23e0393..e440cdddc77c7 100644
--- a/test/functional/apps/dashboard_elements/markdown/_markdown_vis.ts
+++ b/test/functional/apps/dashboard_elements/markdown/_markdown_vis.ts
@@ -39,9 +39,12 @@ export default function ({ getService, getPageObjects }: FtrProviderContext) {
         expect(h1Txt).to.equal('Heading 1');
       });
 
-      it('should not render html in markdown', async function () {
+      it('should not render html in markdown as html', async function () {
         const actual = await PageObjects.visChart.getMarkdownText();
-        expect(actual).to.equal('Heading 1');
+
+        expect(actual).to.equal(
+          'Heading 1\n<h3>Inline HTML that should not be rendered as html</h3>'
+        );
       });
 
       it('should auto apply changes if auto mode is turned on', async function () {