text-2xs text-3xs

[andrewsmallbone]

Smallest font size (text-xs) at 0.75rem seems quite large, I find that I always create 2xs 3xs classes - any reason these couldn't be standard?

.text-2xs {
    font-size: .625rem; line-height: 0.75rem;
 }
.text-3xs {
    font-size: .5rem; line-height: 0.5rem;
}

[deadcoder0904]

@andrewsmallbone 0.75rem = 0.75 * 16 = 3/4 * 16 = 12px which is really small. The recommended smallest font size is 16px I think for readability. That's for body. Some elements that have smaller emphasis require a lower font-size like currency when displaying numbers.

I don't think anything smaller than 0.75rem is needed & you can easily extend it if needed using JIT like text-[0.5rem] or creating your own class.

The goal of Tailwind is to support the most common approaches so doesn't make sense if it's going to be used in a fewer number of apps. Just my 2 cents :)

[hnordt]

I think this should be added to the core. For example, when using FontAwesome icons, even though they can be used as SVGs, by default and by convention it’s more common and easier to customize them with font-size.

IMO, at least the following should be part of the core. It’s probably enough for most use cases, especially for internal dashboard UIs where smaller font sizes are sometimes needed:

  --text-2xs: 0.625rem;
  --text-2xs--line-height: calc(0.75 / 0.625);