<!-- Appears on Tiny Blueprint (https://www.tiny.cloud/blog/) in articles:
 - Custom font sizes in TinyMCE -->
<textarea id="editor">
  <h2>Custom font sizes in TinyMCE</h2>
  <p>This instance of TinyMCE has been configured with a custom set of font sizes. It's also been configured with a default font size of 14pt.</p>
  <p>For more information, check out our article on Tiny Blueprint: <a href="https://www.tiny.cloud/blog/">Custom font sizes in TinyMCE</a>.</p>
</textarea>
@import url('https://fonts.googleapis.com/css2?family=Oswald&display=swap');
tinymce.init({
  selector: "#editor",
  plugins:
    "advcode advlist advtable anchor autocorrect autolink autosave casechange charmap checklist codesample directionality editimage emoticons export footnotes formatpainter help image insertdatetime link linkchecker lists media mediaembed mergetags nonbreaking pagebreak permanentpen powerpaste searchreplace table tableofcontents tinymcespellchecker typography visualblocks visualchars wordcount",
  toolbar:
    "undo redo spellcheckdialog  | blocks fontfamily fontsizeinput | bold italic underline forecolor backcolor | link image | align lineheight checklist bullist numlist | indent outdent | removeformat typography",
  height: "700px",

  //HTML custom font options
  font_size_formats:
    "8pt 9pt 10pt 11pt 12pt 14pt 18pt 24pt 30pt 36pt 48pt 60pt 72pt 96pt",

  toolbar_sticky: true,
  autosave_restore_when_empty: true,
  spellchecker_active: true,
  spellchecker_language: "en_US",
  spellchecker_languages:
    "English (United States)=en_US,English (United Kingdom)=en_GB,Danish=da,French=fr,German=de,Italian=it,Polish=pl,Spanish=es,Swedish=sv",
  typography_langs: ["en-US"],
  typography_default_lang: "en-US",
  content_style: `
            body {
              background: #fff;
            }
    
            @media (min-width: 840px) {
              html {
                background: #eceef4;
                min-height: 100%;
                padding: 0 .5rem;
              }
    
              body {
                background-color: #fff;
                box-shadow: 0 0 4px rgba(0, 0, 0, .15);
                box-sizing: border-box;
                margin: 1rem auto 0;
                max-width: 820px;
                min-height: calc(100vh - 1rem);
                padding:4rem 6rem 6rem 6rem;
              }
            }
          `
});

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

  1. https://cdn.tiny.cloud/1/qagffr3pkuv17a8on1afax661irst1hbr4e6tbv888sz91jc/tinymce/6/tinymce.min.js