diff --git a/addons/mass_mailing/static/src/css/basic_theme_readonly.css b/addons/mass_mailing/static/src/css/basic_theme_readonly.css
new file mode 100644
index 00000000000..340eec95a68
--- /dev/null
+++ b/addons/mass_mailing/static/src/css/basic_theme_readonly.css
@@ -0,0 +1,7 @@
+/* We want to show system's default font in the mail sent with the basic theme.
+   And so we remove font-family from basic theme while saving. But by doing so
+   in readonly mode is not getting proper font in odoo. So we added if from here.
+ */
+#wrapwrap .o_layout.o_basic_theme {
+    font-family: -apple-system, "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
+}
diff --git a/addons/mass_mailing/static/src/js/mass_mailing_editor.js b/addons/mass_mailing/static/src/js/mass_mailing_editor.js
index ec7f01bbc25..b5bc4915918 100644
--- a/addons/mass_mailing/static/src/js/mass_mailing_editor.js
+++ b/addons/mass_mailing/static/src/js/mass_mailing_editor.js
@@ -366,6 +366,14 @@ snippets_editor.Class.include({
             self._disableUndroppableSnippets();
         }
     },
+    cleanForSave: function () {
+        this._super.apply(this, arguments);
+        // remove font-family from all elements for plain text theme (just like gmail)
+        var $basicTheme = this.$editable.find('.o_basic_theme');
+        if($basicTheme.length && this.$editable.data('oe-model') === 'mail.mass_mailing') {
+            this.$editable.find('*').css('font-family', '');
+        }
+    }
 });
 
 var callback = window ? window["callback"] : undefined;
diff --git a/addons/mass_mailing/views/editor_field_html.xml b/addons/mass_mailing/views/editor_field_html.xml
index 8a1a8845aa8..513be80933a 100644
--- a/addons/mass_mailing/views/editor_field_html.xml
+++ b/addons/mass_mailing/views/editor_field_html.xml
@@ -13,6 +13,9 @@
                 <t t-call-assets="mass_mailing.assets_mail_themes"/>
                 <script type="text/javascript" src="/mass_mailing/static/src/js/mass_mailing_editor.js"></script>
             </t>
+            <t t-else="">
+                <link rel="stylesheet" href="/mass_mailing/static/src/css/basic_theme_readonly.css" type="text/css"/>
+            </t>
             <base target="_parent"/>
         </t>
         <t t-set="head" t-value="head_mm_field_text_html_inline + (head or '')"/>