H6

1. 1

<H6>This is an h6 heading</H6>

1. 1
2. 2
3. 3
4. 4
5. 5
6. 6
7. 7
8. 8
9. 9
10. 10
11. 11

import { forwardRef, type HTMLAttributes } from 'react'
import { cn } from '#app/utils/tailwind-merge.ts'

/**
 * A h6 component.
 */
const H6 = forwardRef<HTMLHeadingElement, HTMLAttributes<HTMLHeadingElement>>(({ className, ...props }, ref) => <h6 ref={ref} className={cn('h6', className)} {...props} />)
H6.displayName = 'H6'

export { H6 }

1. 1
2. 2
3. 3
4. 4

.h6 {
	@apply text-fluid-md text-muted-900 max-w-prose font-sans font-bold;
}