Skip to main content
The Italic extension adds support for italic text formatting with keyboard shortcuts, input rules, and commands.

​
Installation

npm install @prosekit/extensions

​
Usage

Add the italic extension to your editor: 
import { defineItalic } from '@prosekit/extensions/italic'
import { createEditor } from '@prosekit/core'

const editor = createEditor({
  extensions: [
    // ... other extensions
    defineItalic(),
  ],
})

​
API Reference

​
defineItalic()

Defines the complete italic extension including:
  • Mark specification for <em> and <i> HTML tags
  • Commands for toggling italic
  • Keyboard shortcuts
  • Input rules for Markdown-style syntax
Returns: ItalicExtension

​
Commands

​
toggleItalic

Toggles italic formatting on the current selection or at the cursor position. 
editor.commands.toggleItalic()

​
Keyboard Shortcuts

ShortcutAction
Mod-iToggle italic formatting
Mod is Cmd on macOS and Ctrl on Windows/Linux.

​
Input Rules

The extension supports Markdown-style input rules:
  • Type *text* to create italic text
  • The asterisks will be automatically removed and the text will be formatted as italic

​
HTML Output

Italic text is rendered as <em> elements: 
<em>Italic text</em>

​
Parsing

The extension recognizes the following HTML elements and styles when parsing content:
  • <em> tag
  • <i> tag
  • Elements with font-style: italic
  • Elements with font-style: normal will clear the italic mark

​
Advanced Configuration

If you need more control, you can use the individual components: 
import { 
  defineItalicSpec,
  defineItalicCommands,
  defineItalicKeymap,
  defineItalicInputRule 
} from '@prosekit/extensions/italic'

const editor = createEditor({
  extensions: [
    defineItalicSpec(),      // Just the mark definition
    defineItalicCommands(),  // Just the commands
    defineItalicKeymap(),    // Just the keyboard shortcuts
    defineItalicInputRule(), // Just the input rules
  ],
})
  • Bold - Bold text formatting
  • Underline - Underline text formatting
  • Strike - Strikethrough text formatting
  • Code - Inline code formatting