Tipografía en Windows 11

  • Artículo

Varias palabras representadas en Segoe UI Variable

Como representación visual del lenguaje, la tarea principal de la tipografía es comunicar información. El sistema de tipos de Windows 11 le ayuda a crear la estructura y la jerarquía en el contenido con el fin de maximizar la legibilidad en la interfaz de usuario.

Segoe UI Variable es la nueva fuente del sistema para Windows. Se trata de una experiencia actualizada del clásico Segoe y usa la tecnología de fuente variable para proporcionar dinámicamente una gran legibilidad a tamaños muy pequeños y contornos mejorados en tamaños de pantalla.

Métricas

La palabra

Pesos

Nombre del peso Valor del eje de peso Visual
Claro 300 La palabra
Semilight 350 La palabra
Regular 400 La palabra
Semibold 600 La palabra
Negrita 700 La palabra

Eje óptico

Letra minúscula que se representa en la variable de interfaz de usuario de Segoe con contornos de las distintas formas que puede tener en función del contexto en el que se representa.

Segoe UI Variable admite dos ejes: peso y tamaño óptico. El eje de peso es incremental, mientras que el eje de tamaño óptico es automático y activado de forma predeterminada. El eje de tamaño óptico controla la forma y el tamaño de los contadores de la fuente, para priorizar la legibilidad en los tamaños pequeños y la personalidad en los tamaños grandes.

Uso de la variable Segoe Fluent

Rampa de tipografías

Windows 11 usa los siguientes valores para varios tipos de texto en la interfaz de usuario.

Ejemplo Peso Alto de tamaño y línea
Ejemplo de texto subtítulo Pequeña 12/16 epx
Ejemplo de texto del cuerpo Texto 14/20 epx
Ejemplo de texto seguro del cuerpo Texto semibolado 14/20 epx
Ejemplo de texto grande del cuerpo Texto 18/24 epx
Ejemplo de texto de subtítulo Mostrar semibolado 20/28 epx
Ejemplo de texto de título Mostrar semibolado 28/36 epx
Ejemplo de texto grande del título Mostrar semibolado 40/52 epx
Ejemplo de texto para mostrar Mostrar semibolado 68/92 epx

Procedimientos recomendados de tipografía en Windows 11

Windows 11 usa segoe UI Variable con los siguientes atributos en función del contexto en el que se muestra el texto.

Atributo Value Notas
Peso Normal, semibold Usar el peso normal para la mayoría del texto, usar Semibold para títulos
Alineación Izquierda, Centro Alinear a la izquierda de forma predeterminada, Alinear el centro solo en casos poco frecuentes, como texto debajo de iconos
Valores mínimos 14px Semibold, 12px Regular El texto menor que estos tamaños y pesos son ilegibles en algunos idiomas
Uso de mayúsculas y minúsculas Caso de oración Usar mayúsculas de oraciones para todo el texto de la interfaz de usuario, incluidos los títulos
Truncamiento Puntos suspensivos y recortes Use puntos suspensivos en la mayoría de los casos; El recorte solo se usa en casos poco frecuentes.

Ejemplos

Sugerencia

Abra la aplicación Galería de WinUI 3 y vea Principios de tipografía en acción.

La aplicación WinUI 3 Gallery incluye ejemplos interactivos de la mayoría de los controles, las características y la funcionalidad de WinUI 3. Obtenga la aplicación en Microsoft Store o el código fuente en GitHub.