Why all the text-sm classes?

[soulchild]

What's the reasoning behind many (most?) components explicitly decreasing the font-size for normal text via text-sm? For instance, IMHO, a checkbox should be rendered at normal (base) font-size, just like running text in paragraphs and such. 14px is a nice base font-size. Wouldn't it make more sense to decrease the base font-size from 16px to 14px and get rid of all the text-sm classes if an overall smaller font-size is desired?

[JamesSingleton]

Going to make an assumption and since this is basically using Tailwind CSS to replicate @radix-ui examples (at least that is how I see it), the checkbox font size is 15px (from the radix example) which is between text-sm and text-base. But that is the beauty of this is you can adjust according to your needs.

[mikevarela]

I'm confused too. I'm building a website that uses these great components, most of which come opiminated in terms of text size, but, my non ChadCN UI pages and components use the base text size, I know we can remove the styles from the components but what if I, a) don't want to play whack a mole, or, b) I update the component from the library and my changes get overwritten. Wouldn't it be best to just inherit the text-base or use some specific value?

[Steveb599]

How can you update the components from the library? it's basically your components which you control

[augchan42]

There's no way to control the text-size from the page that imports the component because text-sm is specified in the source code for the underlying component itself. The specificity at that low level trumps everything else, unless you use !important. These components should not be defaulting to text-sm at such a low level.

[augchan42]

I'm also running into this issue. My font does not play nice with text-sm (it's a pixel font and looks very small). All the components have text-sm set at a granular level and there's no easy way to override it without using !important