---
title: "Format Painter"
description: "Quickly apply formats to multiple pieces of text."
canonical_url: "https://www.tiny.cloud/docs/tinymce/latest/formatpainter/"
md_url: "https://www.tiny.cloud/docs/tinymce/6/formatpainter/index.md"
version: "6"
last_updated: "2026-06-15T08:51:58Z"
tokens: 1741
---
Important This page documents TinyMCE 6. For new projects, Tiny recommends using the latest, most up-to-date version. [See TinyMCE 8 documentation](../../latest/formatpainter/).
# Format Painter

> **Note:** This plugin is only available for [paid TinyMCE subscriptions](/pricing/).
The Format Painter plugin allows a user to copy and paste formatting from one location to another, such as font style and size. The format painter is capable of working with a wide variety of formats such as inline and block formats and styles such as table styles.

## Interactive example

The format painter retains the formatting after application making it possible to apply the same formatting multiple times by using the `Ctrl+Alt+V` keyboard shortcut.

**Example**

```js
tinymce.init({
  selector: 'textarea#format-painter',
  plugins: 'formatpainter code',
  toolbar: 'formatpainter code',
  formats: {
    borderstyle: { selector: 'td,th', styles: { borderTopStyle: 'solid', borderRightStyle: 'solid', borderBottomStyle: 'solid', borderLeftStyle: 'solid', }, remove_similar: true },
    bordercolor: { selector: 'td,th', styles: { borderTopColor: '#32CD32', borderRightColor: '#32CD32', borderBottomColor: '#32CD32', borderLeftColor: '#32CD32' }, remove_similar: true },
    backgroundcolor: { selector: 'td,th', styles: { backgroundColor: '#006400' }, remove_similar: true },
    formatpainter_removeformat: [
      { selector: 'b,strong,em,i,font,u,strike,sub,sup,dfn,code,samp,kbd,var,cite,mark,q,del,ins',
        remove: 'all',
        split: true,
        expand: false,
        block_expand: true,
        deep: true
      },
      { selector: 'span',
        attributes: ['style', 'class'],
        remove: 'empty',
        split: true,
        expand: false,
        deep: true
      },
      { selector: '*:not(tr,td,th,table)',
        attributes: ['style', 'class'],
        split: false,
        expand: false,
        deep: true
      }
    ]
  },
  height: 500,
  content_style: 'body { font-family:Helvetica,Arial,sans-serif; font-size:16px }'
});
```

## Basic setup

To add the Format Painter plugin to the editor, add `formatpainter` to the `plugins` option in the editor configuration.

For example:

```js
tinymce.init({
  selector: 'textarea',  // change this value according to your HTML
  plugins: 'formatpainter',
  toolbar: 'formatpainter'
});
```

## Using Format Painter

The format painter is accessed using either keyboard shortcuts or a toolbar button.

The format painter operates in two modes, one for retrieval and one for application of formatting. The usage of the keyboard is slightly different from the usage of the toolbar buttons.

**Usage with toolbar button**

1. Position the cursor at the source content to retrieve the formatting.
2. Enable the **Format Painter** button to copy the formatting. The **Format Painter** toolbar button background color changes to *grey*

![the Format Painter toolbar button icon](../_images/icons/format-painter.svg)
.
3. Select the goal content to apply the formatting.

**Result**: The formatting from the source content is applied to the goal content.

**Usage with keyboard**

1. Position the cursor at the source content to retrieve formatting.
2. Press the `Ctrl+Alt+C` keys to read the formatting.
3. Select the goal content to apply the formatting.
4. Press the `Ctrl+Alt+V` keys to apply the formatting.

> **Tip:** The format painter retains the formatting after application making it possible to apply the same formatting multiple times by using the `Ctrl+Alt+V` keyboard shortcut.

## Options

The format painter acts upon all [`formats`](../content-formatting/#formats) registered in the editor. In addition to any standard formatting, it will treat **lists** as a block format whenever the [`lists plugin`](../lists/) is made available.

### `formats`

The format painter plugin will register many formats upon initialization. To override these formats, use the [`formats`](../content-formatting/#example-of-usage-of-the-formats-option) option.

The example below showcases the formats registered automatically by the plugin upon initialization. The `formatpainter_removeformat` is used to clear any existing formats before applying the new ones. It is similar to the [`removeformat`](../content-formatting/#removing-a-format) format.

**Type:** `Object`

#### Example: using `formats`

```js
tinymce.init({
  selector: 'textarea',  // change this value according to your HTML
  plugins: 'formatpainter',
  toolbar: 'formatpainter',
  formats: {
    formatpainter_checklist: { selector: 'ul', classes: 'tox-checklist' },
    formatpainter_liststyletype: { selector: 'ul,ol', styles: { listStyleType: '%value' } },
    formatpainter_borderstyle: { selector: 'td,th', styles: { borderTopStyle: '%valueTop', borderRightStyle: '%valueRight', borderBottomStyle: '%valueBottom', borderLeftStyle: '%valueLeft', }, remove_similar: true },
    formatpainter_bordercolor: { selector: 'td,th', styles: { borderTopColor: '%valueTop', borderRightColor: '%valueRight', borderBottomColor: '%valueBottom', borderLeftColor: '%valueLeft' }, remove_similar: true },
    formatpainter_backgroundcolor: { selector: 'td,th', styles: { backgroundColor: '%value' }, remove_similar: true },
    formatpainter_removeformat: [
      {
        selector: 'b,strong,em,i,font,u,strike,sub,sup,dfn,code,samp,kbd,var,cite,mark,q,del,ins',
        remove: 'all', split: true, expand: false, block_expand: true, deep: true
      },
      { selector: 'span', attributes: [ 'style', 'class' ], remove: 'empty', split: true, expand: false, deep: true },
      { selector: '*:not(tr,td,th,table)', attributes: [ 'style', 'class' ], split: false, expand: false, deep: true }
    ]
  }
});
```

### `formatpainter_ignored_formats`

This option makes it possible to block the unwanted formats in the format painter.

**Type:** `String`

**Default value:** `'link,address,removeformat,formatpainter_removeformat'`

#### Example: using `formatpainter_ignored_formats`

```js
tinymce.init({
  selector: 'textarea',  // change this value according to your HTML
  plugins: 'formatpainter',
  toolbar: 'formatpainter',
  formatpainter_ignored_formats: 'link,address,removeformat,formatpainter_removeformat'
});
```

## Toolbar buttons

The Format Painter plugin provides the following toolbar buttons:

| Toolbar button identifier | Description |
| --- | --- |
| `formatpainter` | Enables and disables format painting. |

These toolbar buttons can be added to the editor using:

- The [`toolbar`](../toolbar-configuration-options/#toolbar) configuration option.
- The [`quickbars_insert_toolbar`](../quickbars/#quickbars_insert_toolbar) configuration option.
- [Custom Context toolbars](../contexttoolbar/).

## Commands

The Format Painter plugin provides the following TinyMCE commands.

| Command | Description |
| --- | --- |
| mceRetrieveFormats | Retrieves the formats from the current selection. |
| mcePaintFormats | Applies the formats retrieved using `mceRetrieveFormats` to the current selection. |
| mceToggleFormatPainter | Toggles the Format Painter. |

Examples
```js
tinymce.activeEditor.execCommand('mceRetrieveFormats');
tinymce.activeEditor.execCommand('mcePaintFormats');
tinymce.activeEditor.execCommand('mceToggleFormatPainter');
```
