Skip to main content
The Heading component renders large heading text. Use this component to introduce or differentiate sections of your component.
design-guide-heading-component
import { Heading } from "@hubspot/ui-extensions";

const Extension = () => {
  return <Heading>Heading text</Heading>;
};

​
Props

​
Usage example

The title at the top of an extension to introduce its content.

​
Guidelines

  • DO: use headers to give users a summary of the information that the extension contains.
  • DON’T: use more than one heading for each page or section in the extension.
  • DON’T: use headers for paragraphs or long sentences.
Last modified on February 10, 2026