v0.1

Text

Consistent typography for interface copy

The quick brown fox jumps over the lazy dog.

<Text>The quick brown fox jumps over the lazy dog.</Text>

Variants

All Text styles are mapped to an underlying 12-step scale, organized into four groups (display, heading, body, label) with four relative sizes (extra-small, small, medium, large).

Display - Large

Display - Medium

Display - Small

Display - Extra Small

Heading - Large

Heading - Medium

Heading - Small

Heading - Extra Small

Body - Large

Body - Medium

Body - Small

Body - Extra Small

Label - Large

Label - Medium

Label - Small

Label - Extra Small

<Text variant="display" size="large" />
<Text variant="heading" size="medium" />
<Text variant="body" size="small" />
<Text variant="label" size="extra-small" />
v0.1

Overview

AboutGetting started

Components

AvatarBadgeBannerButtonCalloutCheckboxCodeCode InputColor InputData TableDialogDividerDisclosureDrawerEditable TextEmbedEmphasisError BoundaryFieldFile InputFlexFormFrameGridImageInlineInputMarqueeMenuMeta PixelPortalRootRadio GroupRich Text EditorSelectSkeletonSlotSortableSpacerSpinnerStackStatus IconStepperSwitchTab SwitchTextText AreaToastToggleUrlIcon