Header

A header provides a short summary of content

Page Headers

Headers may be oriented to give the hierarchy of a section in the context of the page.

Content Headers

Headers may be oriented to give the importance of a section.

Icon Headers

A header can be formatted to emphasize an icon.

Subheaders

Headers may be formatted to label smaller or de-emphasized content.

Image

A header may contain an image.

You can also define an image with props.

Icon

A header may contain an icon.

You can also define an icon with props.

Subheader

Headers may contain subheaders.

You can pass any Subheader content to the Header subheader prop.

Disabled

A header can show that it is inactive.

Dividing

A header can be formatted to divide itself from the content below it.

Block

A header can be formatted to appear inside a content block.

Attached

A header can be attached to other content, like a segment.

Floating

A header can sit to the left or right of other content.

Text Alignment

A header can have its text aligned to a side.

Colored

A header can be formatted with different colors.

Inverted

A header can have its colors inverted for contrast.