Tipografia
Stretch type headline
Stretch type headline: Um título em fonte pesada e condensada cujas letras se alargam perto do ponteiro e comprimem as vizinhas para manter o comprimento da linha, antes de voltar à posição com efeito de mola e uma curva identificada.
Como usar Stretch type headline
Stretch type headline usa o formato de prévia “amplo” com o tema “claro/escuro”.
Personalizar a prévia
Estes controles são passados para a demo. Os valores e limites descrevem a prévia; consulte a implementação para conhecer todas as props.
| Controle | Tipo | Valor inicial | Limites da prévia |
|---|---|---|---|
text | text | Loose type, tight line. | Até 60 caracteres |
stretch | number | 0.6 | De 0.2 a 1; passo 0.05 |
feel | select | elastic | Opções: elastic, spring, snap |
caps | boolean | true | Os metadados não indicam outro limite. |
accent | color | #FF3A22 | Os metadados não indicam outro limite. |
autoplay | boolean | true | Os metadados não indicam outro limite. |
showLabel | boolean | true | Os metadados não indicam outro limite. |
Para quais frameworks Stretch type headline está disponível?
Stretch type headline está disponível para React, Vue, Svelte, Astro, HTML. A prévia usa React; as observações sobre o código se referem a index.tsx. Confira as interações na versão escolhida antes de depender delas.
Quais são as dependências de Stretch type headline?
Os metadados React não indicam dependências npm adicionais ao React.
Quais detalhes de acessibilidade aparecem em Stretch type headline?
O código React de Stretch type headline inclui: atributos e manipuladores (aria-hidden, aria-label). Estas são observações do código. Verifique os nomes acessíveis, a ordem do foco e o comportamento do teclado na página completa.
Como Stretch type headline trata a redução de movimento?
Stretch type headline consulta a preferência de movimento no código React por meio de matchMedia(prefers-reduced-motion). Confira a implementação completa, os estilos compartilhados e a versão escolhida com a redução de movimento ativada; estas observações não garantem que todas as animações parem.