Skin and theme configuration

config.skin picks how the editor chrome looks. The value is added to the editor container as a class: skin: "dark" gives the container rte-skin-dark, and the theme stylesheet styles it from there.

var config = {};
config.skin = "dark";          // "" (default look), "dark", "gray", "blue", "rounded-corner"
var editor = new RichTextEditor("#div_editor", config);

Skins in the default theme

ValueLook
(not set)The default light chrome, with square corners.
darkDark toolbar and chrome, for a dark application shell.
grayMuted grey toolbar; less contrast against a white page.
blueBlue toolbar accent.
rounded-cornerThe default colours with rounded corners on the editor frame.

Your own skin

The editor does not validate the value, so any name works as long as you style the matching class yourself:

/* Your own skin: any class name works, the editor just prefixes it. */
.rte-skin-brand .rte-toolbar { background: #101828; }
.rte-skin-brand .rte-toolbar button { color: #e6eefc; }

For changing the editing surface rather than the chrome, see contentCssUrl and setContentCssText. Square corners without a full skin are available through the rte-square modifier.