Sizes
<Card>
<Eyebrow className='m-b-half'>Size 'large' (14px)</Eyebrow>
<Eyebrow className='m-b-2 t-truncate' size='large'>The quick brown fox jumps over the lazy dog</Eyebrow>
<Eyebrow className='m-b-half'>Size 'medium' (12px)</Eyebrow>
<Eyebrow className='m-b-2 t-truncate' size='medium'>The quick brown fox jumps over the lazy dog</Eyebrow>
<Eyebrow className='m-b-half'>Size 'small' (10px)</Eyebrow>
<Eyebrow className='m-b-2 t-truncate' size='small'>The quick brown fox jumps over the lazy dog</Eyebrow>
</Card>
Styles
<Card>
<Eyebrow className='m-b-2'>This is default state</Eyebrow>
<Eyebrow className='m-b-2' italic>Eyebrow Text 'italic'</Eyebrow>
<Eyebrow className='m-b-2' inline>Eyebrow Text 'inline' </Eyebrow>
<Eyebrow className='m-b-2' inline>Eyebrow Text 'inline' </Eyebrow>
</Card>
Best Practices
Importing
import { Eyebrow } from '@servicetitan/design-system';
