---
title: "Superscript & Subscript Tool — Raised and Lowered Text"
description: "Toggle superscript or subscript from one toolbar button or with Cmd/Ctrl+Period and Cmd/Ctrl+Comma, and the sup/sub markup Blok stores."
source: https://blokeditor.com/docs/supSub/
lastmod: 2026-08-05
---

Framework JavaScript

Inline Tools Superscript & Subscript

# Superscript & subscript: raised and lowered text

One toolbar button with a two-option popover that toggles superscript (`<sup>`) or subscript (`<sub>`) on the selection. The two modes are mutually exclusive — applying one removes the other. Shortcuts: Cmd/Ctrl+Period for superscript, Cmd/Ctrl+Comma for subscript.

### Import

TypeScript

```
import { SupSub } from '@bloklabs/core/tools';
```

### Save Data

TypeScript

```
// Stored as HTML inside the block's text field:
// "E = mc<sup>2</sup>" or "H<sub>2</sub>O"
```

JSON

```
{
  "type": "paragraph",
  "data": { "text": "E = mc<sup>2</sup>" }
}
```

### Usage Example

TypeScript

```
import { Blok } from '@bloklabs/core';
import { Paragraph, SupSub } from '@bloklabs/core/tools';

const editor = new Blok({
  holder: 'editor',
  tools: {
    // Paragraph is the default block and is not bundled with the core —
    // without it the editor starts with an "unsupported block" stub.
    paragraph: Paragraph,
    supSub: SupSub,
  },
});
```