RichTextEditor skinning is done via CSS (rte_theme_default.css). Rich Text Editor provides several built-in skins that are ready to use. You can choose from several predefined skins or create your own.
Rounded Corner Theme
Gray Theme
Blue Theme
Create a purple theme using css
<link rel="stylesheet" href="/richtexteditor/rte_theme_default.css" /> <script type="text/javascript" src="/richtexteditor/rte.js"></script> <script type="text/javascript" src='/richtexteditor/plugins/all_plugins.js'></script> <div id="div_editor1"> <p>Rounded Corner Theme</p> </div> <script> var editor1 = new RichTextEditor("#div_editor1", { skin: "rounded-corner", toolbar: "basic" }); </script> <br /> <br /> <div id="div_editor2"> <p>Gray Theme</p> </div> <script> var editor2 = new RichTextEditor("#div_editor2", { skin: "gray", toolbar: "basic" }); </script> <br /> <br /> <div id="div_editor3"> <p>Blue Theme</p> </div> <script> var editor3 = new RichTextEditor(document.getElementById("div_editor3"), { skin: "blue", toolbar: "basic" }); </script> <br /> <br /> <style> .purple_editor { background-color: #b19cd9 !important; border-color: #8470a8 !important; } .purple_editor rte-toolbar { background-color: #b19cd9 !important; } .purple_editor rte-bottom { background-color: #b19cd9 !important; } .purple_editor rte-dialog-inner { background-color: #b19cd9 !important; } .purple_editor rte-line-spliter { background-color: #b19cd9 !important; } .purple_editor rte-dialog-header { } </style> <div id="div_editor4" class="richtexteditor purple_editor"> <p>Create a purple theme using css</p> </div> <script> var editor4 = new RichTextEditor(document.getElementById("div_editor4"), { toolbar: "basic" }); </script>