---
title: TinyMCE custom style formats
slug: cms-11/dev-docs/custom-style-formats
docTags: 
createdAt: 2026-07-22T19:45:21.613Z
---

See the TinyMCE documentation for information about configuring style formats: [https://www.tiny.cloud/docs-4x/configure/content-formatting/#style\_formats](https://www.tiny.cloud/docs-4x/configure/content-formatting/#style_formats)

```csharp
public static class ServiceCollectionExtentions {
  public static IServiceCollection AddTinyMceConfiguration(this IServiceCollection services) {
    services.Configure<TinyMceConfiguration>(config => {
      config.For<StandardPage>(t => t.MainBody)
        .Toolbar("styleselect")
        .StyleFormats(
          new {
            title = "Bold text", inline = "strong"
          },
          new {
            title = "Red text", inline = "span", styles = new {
              color = "#ff0000"
            }
          },
          new {
            title = "Red header", block = "h1", styles = new {
              color = "#ff0000"
            }
          },
          new {
            title = "button link", classes = "btn btn-default", block = "a", inline = "span"
          }
        );
    });
    return services;
  }
}
```

## Localizing formats

Add the translations to your XML translations file as children of the element `<tinymce><editorstyles>`. The title of the format is the key in the XML.

:::hint{type="info"}
**Note**
The title must be lowercase and it must be a valid XML key. For example, you cannot use spaces.
:::

So, write the style formats from the previous example in lowercase and with no spaces. In this case, you replace the spaces with dashes.

```csharp
config.For<StandardPage>(t => t.MainBody)
  .Toolbar("styleselect formatselect")
  .StyleFormats(
    new {
      title = "bold-text", inline = "strong"
    },
    new {
      title = "red-text", inline = "span", styles = new {
        color = "#ff0000"
      }
    },
    new {
      title = "red-header", block = "h1", styles = new {
        color = "#ff0000"
      }
    }
  )
  .BlockFormats("paragraph1=p;header1=h1;header2=h2;header3=h3");
```

```xml
<languages>
  <language name="English" id="en">
    <tinymce>
      <editorstyles>
        <paragraph1>Body Text</paragraph1>
        <header1>Title</header1>
        <header2>Subtitle</header2>
        <header3>Section Heading</header3>
        <bold-text>Important Text</bold-text>
        <red-text>Warning Text</red-text>
        <red-header>Warning Heading</red-header>
      </editorstyles>
    </tinymce>
  </language>
  <language name="Svenska" id="sv">
    <tinymce>
       <editorstyles>
        <paragraph1>Brödtext</paragraph1>
        <header1>Rubrik</header1>
        <header2>Underrubrik</header2>
        <header3>Avsnittsrubrik</header3>
        <bold-text>Viktig Text</bold-text>
        <red-text>Varningstext</red-text>
        <red-header>Varningsrubrik</red-header>
      </editorstyles>
    </tinymce>
  </language>
</languages>
```