diff --git a/src/components/markdown_editor/_index.scss b/src/components/markdown_editor/_index.scss
index 521d3610e10..1611b7ef445 100644
--- a/src/components/markdown_editor/_index.scss
+++ b/src/components/markdown_editor/_index.scss
@@ -1,5 +1,6 @@
 @import 'markdown_editor';
 @import 'markdown_editor_drop_zone';
 @import 'markdown_format';
+@import 'markdown_editor_preview';
 @import 'markdown_editor_text_area';
 @import 'markdown_editor_toolbar';
diff --git a/src/components/markdown_editor/_markdown_editor.scss b/src/components/markdown_editor/_markdown_editor.scss
index aa882a23c70..e03f34d7a71 100644
--- a/src/components/markdown_editor/_markdown_editor.scss
+++ b/src/components/markdown_editor/_markdown_editor.scss
@@ -2,21 +2,4 @@
   &:focus-within {
     @include euiSlightShadowHover;
   }
-
-  .euiMarkdownEditor__textArea,
-  .euiMarkdownEditor__previewContainer {
-    padding: $euiSizeM;
-  }
-}
-
-.euiMarkdownEditor__previewContainer {
-  @include euiScrollBar;
-  background: $euiColorEmptyShade;
-  height: 150px;
-  overflow-y: auto;
-  border: $euiBorderThin;
-}
-
-.euiMarkdownEditor__textArea {
-  background: $euiColorEmptyShade;
-}
+}
\ No newline at end of file
diff --git a/src/components/markdown_editor/_markdown_editor_preview.scss b/src/components/markdown_editor/_markdown_editor_preview.scss
new file mode 100644
index 00000000000..74707692d30
--- /dev/null
+++ b/src/components/markdown_editor/_markdown_editor_preview.scss
@@ -0,0 +1,7 @@
+.euiMarkdownEditor__preview {
+  @include euiScrollBar;
+  height: 150px;
+  overflow-y: auto;
+  border: $euiBorderThin;
+  padding: $euiSizeM;
+}
diff --git a/src/components/markdown_editor/_markdown_editor_text_area.scss b/src/components/markdown_editor/_markdown_editor_text_area.scss
index faa86af0def..023518bf916 100644
--- a/src/components/markdown_editor/_markdown_editor_text_area.scss
+++ b/src/components/markdown_editor/_markdown_editor_text_area.scss
@@ -1,13 +1,15 @@
 .euiMarkdownEditor__textArea {
   @include euiFormControlText;
-  font-family: $euiCodeFontFamily;
   width: 100%;
   height: 100%;
   min-height: 150px;
+  padding: $euiSizeM;
   background-color: $euiFormBackgroundColor;
   border: $euiBorderThin;
   border-bottom: 1px dashed $euiColorLightShade;
   border-color: $euiColorLightShade;
+  // Overrides the euiFormControlText line-height that is very small
+  line-height: $euiLineHeight;
   resize: vertical;
 
   &:focus {
diff --git a/src/components/markdown_editor/_markdown_format.scss b/src/components/markdown_editor/_markdown_format.scss
index 4990ce7bead..aee97c47f0a 100644
--- a/src/components/markdown_editor/_markdown_format.scss
+++ b/src/components/markdown_editor/_markdown_format.scss
@@ -18,9 +18,8 @@ $euiDefaultFontSize: 14px;
 }
 
 .euiMarkdownFormat {
-  // sass-lint:disable-block indentation
-  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial,
-    sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol';
+  @include euiFont;
+  @include euiText;
 
   // Font size variables
   $euiMarkdownFontSizeS: canvasToEm(12px);
@@ -46,10 +45,6 @@ $euiDefaultFontSize: 14px;
   $euiMarkdownAlphaLightShadeReversed: rgba($euiColorEmptyShade, .15);
   $euiMarkdownAlphaDarkShadeReversed: rgba($euiColorEmptyShade, .65);
 
-  &--reversed {
-    color: $euiColorLightestShade;
-  }
-
   > *:first-child {
     // sass-lint:disable-block no-important
     margin-top: 0 !important;
diff --git a/src/components/markdown_editor/markdown_editor.tsx b/src/components/markdown_editor/markdown_editor.tsx
index b514891066a..bcf05dd18c7 100644
--- a/src/components/markdown_editor/markdown_editor.tsx
+++ b/src/components/markdown_editor/markdown_editor.tsx
@@ -217,7 +217,7 @@ export const EuiMarkdownEditor: FunctionComponent<EuiMarkdownEditorProps> = ({
 
         {isPreviewing ? (
           <div
-            className="euiMarkdownEditor__previewContainer"
+            className="euiMarkdownEditor__preview"
             style={{ height: `${height}px` }}>
             <EuiMarkdownFormat processor={processor}>{value}</EuiMarkdownFormat>
           </div>