canvas-kit icon indicating copy to clipboard operation
canvas-kit copied to clipboard

Add `Display`, `Heading`, `Body`, and `Subtext` components to labs

Open alanbsmith opened this issue 4 years ago • 0 comments

🚀 Feature Proposal

Overview

Once Issue #311 is complete, we should build components around them to make it simple for developers to use our type tokens. Specifically, we should create:

  • Display
  • Heading
  • Body
  • Subtext

If it's beneficial, a lower-level Type primitive could be added as well.

Example

<Display>Medium Display Text</Display>
<Title size="large">A Large Title</Title>
<Heading as="h3" size="small">A Small Heading</Heading>
<Body as="p" size="large" fontWeight="bold">This is an example of large, bold body text.</Body>
<Subtext display="block" fontWeight="bold" textTransform="uppercase">bold subtext</Body>

alanbsmith avatar May 17 '21 16:05 alanbsmith