Heading

A web component for text in the library's six heading and two subtitle typography levels.

Text set in one of the heading or subtitle typography levels.

Installation

npm install @3mo/heading

import '@3mo/heading'

Usage

<mo-heading typography='heading3'>Quarterly report</mo-heading>

Examples

• Typographies — Six heading levels from heading1 down to heading6, and two subtitles.
• Relative Size — A heading's size is relative to the surrounding text, up to a cap per level: 36px for heading1.

Accessibility

It only sets the typography: give it role='heading' and aria-level, or use h1 to h6.

API

mo-heading

Properties

| Name | Attribute | Type | Default | Description | | --- | --- | --- | --- | --- | | typography | typography | HeadingTypography | "heading3" | The level, from heading1 (largest) to heading6, or subtitle1 and subtitle2; heading3 by default. |

Slots

| Name | Description | | --- | --- | | (default) | The text of the heading. |

Links

• Documentation
• Changelog
• Source

License

MIT © 3MO GmbH