Calculadora de clamp() para fonte fluida

Calculadora de clamp() para fonte fluida: para que serve

Com clamp() o texto cresce junto com a largura da tela sem precisar de várias media queries: fica pequeno no celular, grande no computador e muda de forma suave entre os dois.

A calculadora faz a conta da reta entre o tamanho mínimo e o máximo nas larguras de tela que você escolher e devolve o valor em rem, que respeita a fonte configurada pela pessoa no navegador. Mostra o tamanho em cada largura comum e avisa quando o máximo passa de 2,5 vezes o mínimo, ponto a partir do qual o zoom de 200% exigido pela WCAG 1.4.4 pode deixar de funcionar.

Como usar

1. Informe os tamanhos mínimo e máximo em px.
2. Escolha entre quais larguras de tela ele cresce.
3. Copie o clamp() pronto.

Quando usar

• Títulos que se ajustam ao celular e ao computador.
• Espaçamentos fluidos entre seções.
• Escala tipográfica sem media queries.

Perguntas frequentes

Como o clamp() funciona?

clamp(mínimo, preferido, máximo) usa o valor preferido enquanto ele estiver entre os limites. O preferido é uma reta, um valor em rem somado a uma fração de vw, que cresce junto com a largura da tela: no celular fica no mínimo e no computador chega ao máximo.

Por que usar rem e não px?

rem acompanha o tamanho de fonte que a pessoa escolheu no navegador. Com px, quem aumentou a fonte padrão por dificuldade de leitura não vê diferença.

O que é o aviso de zoom?

A WCAG pede que o texto possa ser ampliado em 200%. Como a parte em vw não cresce com o zoom, um máximo muito maior que o mínimo pode impedir essa ampliação. Uma regra prática segura é o máximo não passar de 2,5 vezes o mínimo.

É grátis mesmo?

Sim, 100% grátis. Sem cadastro, sem assinatura e sem limite de uso. Todas as ferramentas do Ferramentas123 são gratuitas e rodam direto no seu navegador.

Ferramentas parecidas