Docs
Basic Marks

Basic Marks

Set of essential text formatting options.

Mark Toolbar Button

🌳 Blocks

Easily create headings of various levels, from H1 to H6, to structure your content and make it more organized.
Create blockquotes to emphasize important information or highlight quotes from external sources.
// Use code blocks to showcase code snippets
function greet() {
  console.info('Hello World!');
}

🌱 Marks

Add style and emphasis to your text using the mark plugins, which offers a variety of formatting options.
Make text bold, italic, underlined, or apply a combination of these styles for a visually striking effect.
Add strikethrough to indicate deleted or outdated content.
Write code snippets with inline code formatting for easy readability.

Features

  • Includes commonly used text styling features: bold, italic, underline, strikethrough, subscript, superscript, and code.

Plugins:

  • createBoldPlugin() for bold mark
  • createItalicPlugin() for italic mark
  • createUnderlinePlugin() for underline mark
  • createStrikethroughPlugin() for strikethrough mark
  • createSubscriptPlugin() for subscript mark
  • createSuperscriptPlugin() for superscript mark
  • createCodePlugin() for code mark

Installation

npm install @udecode/plate-basic-marks

Usage

import { createBasicMarksPlugin } from '@udecode/plate-basic-marks';
 
const plugins = [
  // ...otherPlugins,
  createBasicMarksPlugin(),
];

Keyboard Interactions

KeyDescription
Cmd + B

Toggle the bold formatting for the selected text.

Cmd + I

Toggle the italic formatting for the selected text.

Cmd + U

Toggle the underline formatting for the selected text.

Cmd + E

Toggle the code formatting for the selected text.

Cmd + Shift + X

Toggle the strikethrough formatting for the selected text.

Cmd + ,

Toggle the subscript formatting for the selected text.

Cmd + .

Toggle the superscript formatting for the selected text.

API

createBasicMarksPlugin

createBoldPlugin

Options

Collapse all

    Node properties to delete.

    Hotkey to toggle mark.

createCodePlugin

Options

Collapse all

    Node properties to delete.

    Hotkey to toggle mark.

createItalicPlugin

Options

Collapse all

    Node properties to delete.

    Hotkey to toggle mark.

createUnderlinePlugin

Options

Collapse all

    Node properties to delete.

    Hotkey to toggle mark.

createStrikethroughPlugin

Options

Collapse all

    Node properties to delete.

    Hotkey to toggle mark.

createSubscriptPlugin

Options

Collapse all

    Node properties to delete.

    Hotkey to toggle mark.

createSuperscriptPlugin

Options

Collapse all

    Node properties to delete.

    Hotkey to toggle mark.

Basic ElementsBlock Selection