Formatting

The formatting table displays how to control the way text appears.

In the following table, the TinyMCE v3/htmlArea icon column displays icons that are available with the TinyMCE version 3 and htmlArea editors. The TinyMCE v4 icon column displays icons that are available with the TinyMCE version 4 editor. Names marked with an asterisk (*) are not available with the htmlArea editor.

Table 1. Formatting table
TinyMCE v3/htmlArea icon TinyMCE v4 icon Name Description
New doc HTML icon
New Document* Clears the contents of the HTML field.
Bold HTML icon
TinyMCE v4 bold icon
Bold

Applies bold formatting to the selected text or current word.

Keyboard shortcut: CTRL + B

Italic HTML icon
TinyMCE v4 italic icon
Italic

Applies italics formatting to the selected text or current word.

Keyboard shortcut: CTRL + I

Uline HTML icon
TinyMCE v4 underline icon
Underline

Applies underline formatting to the selected text or current word.

Keyboard shortcut: CTRL + U

Strike HTML icon
Strikethrough* Applies strikethrough formatting to the selected text or current word.
Right text align HTML icon
TinyMCE v4 align right icon
Align Right

Applies right alignment to the current paragraph.

Code reference: text-align:right

Center text align HTML icon
TinyMCE v4 align center icon
Align Center

Applies center alignment to the current paragraph.

Code reference: text-align:center

Left text align HTML icon
TinyMCE v4 align left icon
Align Left

Applies left alignment to the current paragraph.

Code reference: text-align:left

Full text align HTML icon
Justify

Applies justified alignment, which stretches the lines to equal width, to the current paragraph.

Code reference: text-align:justify

Paragraph styles HTML icon
Format Applies a paragraph style to the current paragraph, such as Paragraph, Heading 1, and Preformatted.
Font family HTML icon
TinyMCE v4 fonts icon
Font Family Applies a font family to the selected text or current word.
Font size HTML icon
TinyMCE v4 font size icon
Font Size Applies a font size to the selected text or current word.
Bulleted HTML icon
TinyMCE v4 bullets icon
Insert/Remove Bulleted List Applies or removes unordered list tags for the selected paragraphs. Click the arrow beside the button to select a different bullet type.
Numbered HTML icon
Tiny MCE v4 numbers icon
Insert/Remove Numbered List Applies or removes ordered list tags for the selected paragraphs. Click the arrow beside the button to select a different number type.
Decrease indent HTML icon
Decrease Indent

Removes indentation from the current or selected paragraphs (removes 30px of left padding; padding cannot be less than 0).

Code reference: padding-left

Indent HTML icon
Increase Indent

Applies indentation to the current or selected paragraphs (adds 30px of left padding).

Code reference: padding-left

Block quote HTML icon
Block Quote*

Applies the <blockquote> tag, which defines a long quotation, to the current or selected paragraphs. Browsers usually indent these elements.

Code reference: <blockquote>

Text color HTML icon
Tiny MCE v4 text color icon
Select Text Color Applies font color to the current word or selected text. Click the button to use the current color, or click the arrow next to the button to view more colors. Click More Colors... to view various color options and the hexadecimal codes.
Background color HTML icon
TinyMCE v4 background color icon
Select Background Color Applies background color to the current word or selected text. Click the button to use the current color, or click the arrow next to the button to view more colors. Click More Colors... to view various color options and the hexadecimal codes.
Remove format HTML icon
Clear Formatting* Removes the inline styles and formatting from the selected text.
Subscript HTML icon
Subscript*

Applies subscript text, which appears half a character below the baseline, to the current word or selected text.

Code reference: <sub>

Superscript HTML icon
Superscript*

Applies superscript text, which appears half a character above the baseline, to the current word or selected text.

Code reference: <sup>