---
title: "TextStyle extension"
description: "Use the Text Style extension in Tiptap to add inline span elements with custom styles. Learn more in our docs!"
canonical_url: "https://tiptap-docs.lin52025i.qzz.io/editor/extensions/marks/text-style"
---

# TextStyle extension

Use the Text Style extension in Tiptap to add inline span elements with custom styles. Learn more in our docs!

This mark renders a `<span>` HTML tag and enables you to add a list of styling related attributes, for example font-family, font-size, or color. The extension doesn’t add any styling attribute by default, but other extensions use it as the foundation, for example [`FontFamily`](https://tiptap-docs.lin52025i.qzz.io/editor/extensions/functionality/fontfamily.md) or [`Color`](https://tiptap-docs.lin52025i.qzz.io/editor/extensions/functionality/color.md).

> **Interactive demo:** [Textstyle](https://embed.tiptap.dev/preview/Marks/Textstyle)

## Apply font sizes

`TextStyle` provides the `<span>` mark, while extensions such as [`FontSize`](https://tiptap-docs.lin52025i.qzz.io/editor/extensions/functionality/fontsize.md) add specific style attributes. Install the text-style package and include both extensions in an editor with a document schema, such as the one provided by `StarterKit`:

```bash
npm install @tiptap/extension-text-style @tiptap/starter-kit
```

```ts
import { Editor } from '@tiptap/core'
import { TextStyle, FontSize } from '@tiptap/extension-text-style'
import StarterKit from '@tiptap/starter-kit'

const editor = new Editor({
  extensions: [StarterKit, TextStyle, FontSize],
})

editor.chain().focus().setFontSize('18px').run()
```

The command renders the selected text as a `span` with an inline `font-size: 18px` style.

## Install

```bash
npm install @tiptap/extension-text-style
```

## Commands

### removeEmptyTextStyle()

Remove `<span>` tags without an inline style.

```js
editor.command.removeEmptyTextStyle()
```

## Source code

[packages/extension-text-style/](https://github.com/ueberdosis/tiptap/blob/main/packages/extension-text-style/)