Typography

A component that enforces visual consistency in text content with semi-decoupled semantics and styles. Contextual defaults minimize design overhead.

import { T } from '@kaynora/ui'

export default function () {
  return (
    <>
      <T type='h1'>Heading</T>
      <T>Paragraph text</T>
    </>
  )
}

The size prop determines the font size of the text.

import { T } from '@kaynora/ui'

export default function () {
  return (
    <T size='s'>Some small text</T>
  )
}

<Typography />

<T />

'h1' | 'h2' | 'h3' | 'h4' | 'p' | 'span'

'xs' | 's' | 'm' | 'l' | 'xl'

'300' | '400' | '500'

'primary' | 'dimmed' | 'inverted' | 'disabled' | 
'accent' | 'success' | 'error'

{
  root: HTMLElementProps
}