Lumeo

Heading

A semantic heading component that renders h1-h6 elements with sensible default sizes and weights.

Installation

dotnet add package Lumeo

One-time app setup (AddLumeo(), CSS & JS) is covered in the installation guide.

Usage

@using Lumeo

<Heading />

Heading Level 1

Heading Level 2

Heading Level 3

Heading Level 4

Heading Level 5
Heading Level 6

h2 with small text

h3 with 3xl text

h4 with lg text, normal weight

Default tight tracking (h1)

Normal tracking

Wide tracking

Pick a heading level to see it applied live.

This is a level 2 heading

API Reference

Heading

Property Type Default Description
Level int 2 Heading level (1–6). Determines the HTML element (h1–h6) and default size, weight, and tracking.
Size string? auto Override the default text size. Maps to text-{value}. Defaults: h1=4xl, h2=3xl, h3=2xl, h4=xl, h5=lg, h6=base.
Weight string? auto Override the default font weight. Defaults: h1/h2=bold, h3/h4=semibold, h5/h6=medium.
Tracking string? auto Letter spacing override. Maps to tracking-{value}. Defaults to "tight" for h1/h2.