[Feature request] Font size smaller/bigger

[hmaesta]

Sometimes I just want the text to be a little smaller than it's parent. Since Tailwind uses rem as default, it's not that usual to do that.

So my feature request is to create text-smaller-* and text-bigger-*, initially with 3 sizes for each (to be honest I don't think the 50% is so necessary on both cases, but...)

extend: {
        fontSize: {
            'smaller-10': '0.9em',     // 10% smaller
            'smaller-25': '0.75em',    // 25% smaller
            'smaller-50': '0.5em',     // 50% smaller
            'bigger-10' : '1.1em',     // 10% bigger
            'bigger-25' : '1.25em',    // 25% bigger
            'bigger-50' : '1.5em',     // 50% bigger
        },
}

[lihbr]

Hi @hmaesta, thanks for your input!

Although to be honest, I wasn't able to see relevant use cases resulting of best practices for this so far:

I mean, if your base font size is 16px, then applying for instance bigger-10 will lead to font size being 17.6px? This sounds so wrong and out of any design system, even minimal, to me, and it will also mess up your baseline grid and such. What about using the closest font size class instead? text-lg (18px).
This was just an example with the base font size but I think things are the same with others, also I think it'll lead to people chaining them intentionally or not, leading to even crazier font sizes.

Well, you named it but in my opinion it's really not a good practice to set your font size with em units. To me font sizes across an application, website, print thing, whatever, should be defined through a type-scale starting from a base font size (commonly 16px on the web) and then using multiples to define the other font sizes.

[adamwathan]

No plans to implement this out of the box for the reason @lihbr mentioned — it leads to lots of inconsistency and weird values in your designs and it's not something I would ever do personally.

You are free to add these to your own config file of course though, Tailwind is extremely customizable and designed to let you completely replace the defaults on a project by project basis.