Typography Blocks

Typography blocks are fundamental elements for displaying text content in your documents. BlockNote supports various typography blocks to help you structure and format your content effectively.

Paragraph

Type & Props

type ParagraphBlock = {
  id: string;
  type: "paragraph";
  props: DefaultProps;
  content: InlineContent[];
  children: Block[];
};

Heading

Configuration Options

type HeadingBlockOptions = Partial<{
  defaultLevel?: number;
  levels?: number[];
  allowToggleHeadings?: boolean;
}>;

defaultLevel: The default level for headings which are created/inserted without a set level, which is 1 by default.

levels: The heading levels that the block supports, or '1'-'6' by default.

allowToggleHeadings: Whether toggle headings should be supported, true by default. Toggle headings have a button which toggles between hiding and showing the block's children.

Type & Props

type HeadingBlock = {
  id: string;
  type: "heading";
  props: {
    level: 1 | 2 | 3 = 1;
  } & DefaultProps;
  content: InlineContent[];
  children: Block[];
};

level: The heading level, representing a title (level: 1), heading (level: 2), and subheading (level: 3).

Quote

Type & Props

type QuoteBlock = {
  id: string;
  type: "quote";
  props: DefaultProps;
  content: InlineContent[];
  children: Block[];
};