A tipografia é um elemento essencial no design system. Ela refere-se ao conjunto de estilos de texto, famílias tipográficas, peso da font, altura da linha e outros elementos e propriedades do texto. A escala tipográfica é a forma como esses elementos são estruturados e escalados para criar uma hierarquia visual e melhorar a legibilidade do texto.

Para criar uma escala tipográfica, é importante fazer uma auditoria do design e identificar os diferentes estilos de texto presentes. A partir disso, é possível definir um tamanho base para o texto (entre 14-16px), que normalmente é o tamanho do corpo do texto. Em seguida, é possível utilizar uma escala, como o Golden Ratio ou uma escala personalizada, para multiplicar ou dividir o tamanho base e criar os diferentes tamanhos de texto.

Ao criar a escala tipográfica, é importante levar em consideração boas práticas, como manter os tamanhos de fonte arredondados e divisíveis por quatro, e também ajustar o espaçamento entre os caracteres de acordo com o tamanho da fonte. Além disso, é recomendado não reduzir o tamanho do texto abaixo de 16 pixels para garantir a legibilidade, seguindo as recomendações de acessibilidade.

É possível combinar diferentes estilos de tipografia para criar uma hierarquia visual e dar destaque aos diferentes elementos do seu design. No entanto, não exagere! É recomendado utilizar no máximo duas famílias tipográficas para evitar uma aparência confusa.

Em resumo, ao criar uma escala tipográfica, é importante fazer uma auditoria do design para identificar e categorizar toda a aplicação da tipografia no seu produto. Os diferentes elementos do texto são estruturados e escalados para criar uma hierarquia visual e melhorar a legibilidade, e também irão manter uma coerência na aplicação dos textos no seu sistema.