Playground de font-size-adjust en CSS

Explora font-size-adjust con controles para conservar el tamaño percibido del texto al cambiar de fuente y métrica.

Preguntar a la IA

Playground de font-size-adjust en CSS

Respuesta generada con openai/gpt-5.4-nano. La IA puede cometer errores. Revisa siempre el resultado.

BaselineLab compara font-size-adjust con texto real y cambios de familia. Observa x-height, cap-height y ancho de caracteres con palabras como minimum, fallback y readable. La propiedad ayuda a conservar el tamaño percibido cuando cambia la fuente usada.

HTML
<p class="font-size-adjust-sample">
  BaselineLab compara font-size-adjust con texto real y cambios de familia.
  Observa x-height, cap-height y ancho de caracteres con palabras como minimum, fallback y readable.
  La propiedad ayuda a conservar el tamaño percibido cuando cambia la fuente usada.
</p>
Tailwind CSS
Algunas clases con valores arbitrarios pueden sustituirse por clases nativas, según el valor y la configuración de Tailwind CSS.
<p class="max-w-2xl [font-family:Verdana,_Geneva,_sans-serif] text-2xl font-semibold leading-normal [font-size-adjust:0.55]">
  BaselineLab compara font-size-adjust con texto real y cambios de familia.
  Observa x-height, cap-height y ancho de caracteres con palabras como minimum, fallback y readable.
  La propiedad ayuda a conservar el tamaño percibido cuando cambia la fuente usada.
</p>
CSS
.font-size-adjust-sample {
  max-inline-size: 40rem;
  font-family: Verdana, Geneva, sans-serif;
  font-size: 1.5rem;
  font-weight: 600;
  line-height: 1.45;
  font-size-adjust: 0.55;
}