Fontes
Mantenha tudo organizado com as coleções
Salve e categorize o conteúdo com base nas suas preferências.
Substitua todas as instâncias de Roboto por Roboto Flex. Personalize uma escala de tipo de base
otimizada para o relógio e a linguagem de design Expressiva do Material 3.
Usamos eixos variáveis, largura e peso variáveis para definir o estilo de telas
grandes e textos de título para melhorar o estilo e trazer mais utilidade e legibilidade
para tamanhos menores.
Roboto Flex
O Roboto Flex oferece um conjunto de eixos variáveis que atendem aos casos de uso do seu app.
Eixos ajustáveis
Embora as fontes variáveis possam ter vários atributos para
expressão, há dois atributos estilísticos personalizáveis (ou eixos) que são
mais aplicáveis ao design de produtos: peso e largura.
Peso
Peso é o atributo principal que define a espessura geral dos traços de uma
fonte em qualquer tipo de letra. Os pesos mais comuns são regular e
negrito, mas os pesos podem cobrir extremos, de muito leves a muito pesados. Se
o tipo de letra for variável, ele vai fornecer uma faixa completa e contínua de espessuras
de traço, tornando o número de pesos efetivamente ilimitado.
Lembretes importantes
warning
Cuidado
Cuidado ao usar um tipo de peso muito leve para o corpo do texto.
Telas de resolução mais baixa podem ter problemas com tipografias delicadas, especialmente as pequenas. Use pesos mais leves em tamanhos de fonte maiores, como o tipo
de exibição.
warning
Cuidado
Por outro lado, o peso excessivo em tamanhos menores pode afetar
a legibilidade. Um tipo muito grosso pode ser difícil de ler.
Largura
A largura é o resultado de quanto espaço horizontal é ocupado pelos
caracteres de uma família tipográfica. Uma largura estreita permite que mais caracteres caibam por linha,
enquanto uma largura maior pode oferecer mais personalidade.
Lembretes importantes
check_circle
O que fazer
Uma largura menor pode permitir que mais caracteres caibam em
tamanhos pequenos, como nome ou um número longo.
cancel
O que não fazer
Como estilos mais largos ocupam mais espaço, evite usá-los em
áreas com espaço limitado, como no cabeçalho da página do app.
O conteúdo e os exemplos de código nesta página estão sujeitos às licenças descritas na Licença de conteúdo. Java e OpenJDK são marcas registradas da Oracle e/ou suas afiliadas.
Última atualização 2025-07-27 UTC.
[[["Fácil de entender","easyToUnderstand","thumb-up"],["Meu problema foi resolvido","solvedMyProblem","thumb-up"],["Outro","otherUp","thumb-up"]],[["Não contém as informações de que eu preciso","missingTheInformationINeed","thumb-down"],["Muito complicado / etapas demais","tooComplicatedTooManySteps","thumb-down"],["Desatualizado","outOfDate","thumb-down"],["Problema na tradução","translationIssue","thumb-down"],["Problema com as amostras / o código","samplesCodeIssue","thumb-down"],["Outro","otherDown","thumb-down"]],["Última atualização 2025-07-27 UTC."],[],[],null,["# Fonts\n\nReplace all instances of Roboto with Roboto Flex. Tailor a baseline type scale\nthat is optimized for the watch and the Material 3 Expressive design language.\n\nUsing variable axis, variable width and weight to curate how we style big\ndisplay and title text to elevate style and bring more utility and legibility\nfor smaller sizes.\n\nRoboto Flex\n-----------\n\n\nRoboto Flex offers a set of variable axis that serves your app's use cases. \n\n\u003cbr /\u003e\n\nAdjustable axes\n---------------\n\nWhile variable fonts can have a multitude of variable font attributes for\nexpression, there are two customizable stylistic attributes (or axes) that are\nmost applicable for product design: weight and width.\n\n### Weight\n\n\n[Weight](https://fonts.google.com/knowledge/choosing_type/exploring_typefaces_with_multiple_weights_or_grades) is the primary attribute that defines the overall thickness of a\ntypeface's strokes in any given font. The most common weights are regular and\nbold, but weights can cover extremes from the very light to the very heavy. If\nthe typeface is variable, it provides a full, continuous range of stroke\nthicknesses, making the number of weights effectively unlimited. \n\n\u003cbr /\u003e\n\n#### Things to remember\n\nwarning\n\n### Caution\n\nBe careful of using too light a weight type for body text.\nLower resolution displays can struggle with delicate, especially small\ntypography. Use lighter weights at larger font sizes, such as display\ntype. \nwarning\n\n### Caution\n\nConversely, excessive weight at smaller sizes may affect\nlegibility. Too thick a type may be difficult to read.\n\n### Width\n\n\n[Width](https://fonts.google.com/knowledge/glossary/width) is the result of how much horizontal space is taken up by a\ntypeface's characters. A narrow width allows more characters to fit per line\nwhile a wider width may offer more personality. \n\n\u003cbr /\u003e\n\n#### Things to remember\n\ncheck_circle\n\n### Do\n\nA thinner width can allow for more characters to fit at\nsmall sizes, such as name or a long number. \ncancel\n\n### Don't\n\nSince wider styles take up more space, avoid using them for\nareas with limited space, such as in the app page header."]]
