Should components be built in only one size?

Ask the community
1

I’m charged with refactoring components in my team’s design system.

  1. Should components be built in only one size? I’ve seen systems that build for larger breakpoints and smaller breakpoints. However, some systems (such as Material) include have one size. I wonder if I’m missing something about responsive components.

  2. For components using text labels, should we also build only one size? Our devs say that the link component, for example, has a text size that’s inherited. It could theoretically be any size (that aligns with our type tokens).

So we’re wondering whether to build out all the variants that match our type scale, or simply build one base size. I have only seen systems build one size for the link component.

2

I personally use Variants to define different sizes so you have a clear consistent specification. Utilized Text styles can still be changed though and are not locked.
The component is not fully automatically responsive on its own, it still requires you to manually switch to a different size variant.