Text Formatting

Available plugins

Plugin	Export	Shortcut
Bold	`boldPlugin`	`Mod-b`
Italic	`italicPlugin`	`Mod-i`
Underline	`underlinePlugin`	`Mod-u`
Strikethrough	`strikethroughPlugin`	—
Superscript	`superscriptPlugin`	`Mod-.`
Subscript	`subscriptPlugin`	`Mod-,`
Text Color	`textColorPlugin`	—
Highlight	`highlightPlugin`	—
Inline Code	`inlineCodePlugin`	Mod-`

Usage


import { availablePlugins } from "@inkstream/starter-kit"
 
<RichTextEditor
  plugins={[
    availablePlugins.paragraph,
    availablePlugins.bold,
    availablePlugins.italic,
    availablePlugins.underline,
    availablePlugins.strike,
    availablePlugins.superscript,
    availablePlugins.subscript,
    availablePlugins.textColor,
    availablePlugins.highlight, 
    availablePlugins.code]}
  toolbarLayout={['bold', 'italic', 'underline', 'strikethrough', 'superscript', 'subscript', 'code']}
/>

Text color

textColorPlugin renders a color picker dropdown in the toolbar. The color is stored as an inline style on a span mark.


<RichTextEditor
  plugins={[availablePlugins.textColor, availablePlugins.highlight]}
  toolbarLayout={['textColor', 'highlight']}
  pluginOptions={{
    textColor: {
      colors: ['#000000', '#FF0000', '#0000FF', '#008000'],
    },
  }}
/>