Typography

Sen-UI ships zero-dependency utility classes for headings H1–H6 and paragraphs. Type inside the box below to preview your own copy in every style.

Sample text (updates all previews)

The quick brown fox jumps over the lazy dog.


<div className="typography-h1">
  The quick brown fox jumps over the lazy dog.
</div>

The quick brown fox jumps over the lazy dog.


<div className="typography-h2">
  The quick brown fox jumps over the lazy dog.
</div>

The quick brown fox jumps over the lazy dog.


<div className="typography-h3">
  The quick brown fox jumps over the lazy dog.
</div>

The quick brown fox jumps over the lazy dog.


<div className="typography-h4">
  The quick brown fox jumps over the lazy dog.
</div>

The quick brown fox jumps over the lazy dog.


<div className="typography-h5">
  The quick brown fox jumps over the lazy dog.
</div>

The quick brown fox jumps over the lazy dog.


<div className="typography-h6">
  The quick brown fox jumps over the lazy dog.
</div>

The quick brown fox jumps over the lazy dog.


<div className="typography-p">
  The quick brown fox jumps over the lazy dog.
</div>