Color Themes for Froala WYSIWYG Editor

by froala

HTML

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/codemirror.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/codemirror.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/mode/xml/xml.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<script src="https://editor-latest.s3.amazonaws.com/v3/js/froala_editor.pkgd.min.js"></script>
<link rel="stylesheet" href="https://editor-latest.s3.amazonaws.com/v3/css/froala_editor.pkgd.min.css">
<link rel="stylesheet" href="https://editor-latest.s3.amazonaws.com/v3/css/froala_style.min.css">
<link rel="stylesheet" href="https://editor-latest.s3.amazonaws.com/v3/css/themes/dark.min.css">
<link rel="stylesheet" href="https://editor-latest.s3.amazonaws.com/v3/css/themes/royal.min.css">
<link rel="stylesheet" href="https://editor-latest.s3.amazonaws.com/v3/css/themes/gray.min.css">
<div id="eg-dark-theme">
  Dark Theme
</div>
<br/>
 
<div id="eg-gray-theme">
  Gray Theme
</div>
<br/>
 
<div id="eg-royal-theme">
  Royal Theme
</div>

JavaScript

new FroalaEditor('div#eg-dark-theme', {
        // Set dark theme name.
        theme: 'dark',
        zIndex: 2003
      })

      new FroalaEditor('div#eg-gray-theme', {
        // Set gray theme name.
        theme: 'gray',
        zIndex: 2001
      })

      new FroalaEditor('div#eg-royal-theme', {
        // Set royal theme name.
        theme: 'royal'
      })