Back in my school days (many years ago), I learned typography and text sizes with a Modular Scale. I still use it in my sass styles. https://www.modularscale.com/ … Every website or app looks much better with a Modular Scale of font sizes.
The problem is: tools like Photoshop, Sketch, Figma, etc. don’t support modular scale. Somehow it’s always 10, 11, 12, 14, 16, 18px, etc. You can only achieve the best font scale when you code your designs.
I would be thrilled if Penpot would be the first (and maybe the only) design tool that supports Modular Scale.
And I would love to cooperate (in code and design) to achieve it.
1 Like
Hi @Ton_Savenije, do you think that could be a plugging into penpot?
How would you imagine such a support to look like?
- One could replace the usual values in the size-picker with the modular values, but that would also mean that there is a fixed base for the modular scale instead of a flexible one
That’s precisely how I imagine it. There should be a general setting for the fixed (body font-size)base and ratio.
The size could be a selection of sizes. The sizes to choose from could be calculated or a number field you multiply by. I prefer the first option, calculated sizes.
If I have the time these days I will design it in a wireframe.
re: plugin: thats what I also thought of; A plugin that generates a series of modular-scale-sized text styles? (In larger projects it makes sense to use styles instead of the size-picker a anyway)
1 Like
Hi Ton. Thanks for bringing this up. I’m currently working on a Typography task for my website and I checked the benefits and caveats of using a modular type scale just after reading your post. It sounds interesting to dig deeper into this topic. I found another tool, that can help with evaluation of modular scale. I leave a link for other that might be interested in learning more about this.
https://typescale.com/
1 Like
