Ir a la guía de uso
Typography Scalepor Owl-Listener

Typography Scale Skill.

Crea una jerarquía legible a partir de un conjunto reducido de estilos de texto documentados.

  • Diseño de UI
  • Tipografía
Revisión de la fuente · Typography ScaleSKILL.md
Tarea Diseño de UI Produce • Una escala de estilos de texto con nombre, con tamaño, peso, interlineado y espaciado entre letras. • Asignación de fuentes por rol para cuerpo, encabezados y texto técnico. • Reglas de uso adaptable y comprobaciones con contenido real. Antes de empezar Requiere los archivos de fuente reales o las fuentes disponibles de la plataforma para una validación visual significativa.
Resumen editorial · fuente revisada 2026-10-07 · no es un ejemplo generado

01 Qué hace

Crea un sistema tipográfico coherente

Una referencia de sistema tipográfico que abarca tamaños modulares, peso, interlineado, espaciado entre letras, roles de fuente y uso adaptable.

Flujo de trabajo basado en la fuenteNo es una prueba de rendimiento de ejecución

El enfoque de trabajo

Typography Scale combina las relaciones de tamaño con el peso, el interlineado y el espaciado entre letras. Trata un sistema tipográfico como algo más que una secuencia de tamaños de fuente: una leyenda, un párrafo de cuerpo, un encabezado y una línea de display requieren roles y condiciones de uso distintos.

La fuente incluye ejemplos de proporciones modulares y elecciones de roles de fuente, además de pautas para móvil sobre encabezados y medida de lectura. Son reglas de partida que conviene probar con contenido real. No afirma que una proporción matemática, por sí sola, garantice una tipografía legible con cualquier fuente o escritura.

Entregables esperados

  • Una escala de estilos de texto con nombre, con tamaño, peso, interlineado y espaciado entre letras.
  • Asignación de fuentes por rol para cuerpo, encabezados y texto técnico.
  • Reglas de uso adaptable y comprobaciones con contenido real.
Ver el brief de ejemplo

Del brief a la revisión

  1. 01
    Elige la relación base

    Selecciona una base para el cuerpo de texto y una proporción adecuadas al contenido y a la marca existente.

  2. 02
    Define estilos completos

    Combina cada tamaño con peso, interlineado, espaciado entre letras y un rol de uso claro.

  3. 03
    Prueba texto real

    Comprueba encabezados largos, párrafos de cuerpo y anchos móviles; evita introducir tamaños innecesarios para arreglar casos individuales.

02 Cuándo usarlo

Cuándo usarlo

Requiere los archivos de fuente reales o las fuentes disponibles de la plataforma para una validación visual significativa.

Buen encaje

  • Estilos de texto inconsistentesÚtil cuando un producto ha acumulado encabezados y etiquetas casi duplicados.
  • Bases de nuevas UIEstablece los roles tipográficos antes de que cada pantalla invente su propia escala.

Límites que conviene revisar

  • No solo la medida de lecturaLa longitud de línea importa, pero este skill aborda un sistema tipográfico más amplio.
  • No es una licencia de tipografíaLa selección y el uso de fuentes siguen requiriendo la licencia adecuada y disponibilidad en la plataforma.

Aporta estos datos

  • Fuentes y marcaIndica las familias aprobadas, los pesos disponibles y las restricciones existentes.
  • Muestras de contenidoIncluye etiquetas, encabezados, párrafos, código o cifras realistas.
  • Contextos de pantallaDescribe los requisitos para móvil, interfaces densas y lectura de texto largo.

03 Decisiones importantes

Decisiones importantes

  1. Los estilos llevan roles

    Los casos de uso documentados reducen las decisiones arbitrarias entre tamaños contiguos.

  2. Móvil sin reducirlo todo

    La fuente distingue entre reducir los encabezados y mantener un cuerpo de texto legible como base.

04 Ejemplo de brief

Prueba un brief concreto

El brief de ejemplo siguiente no se ha probado. Revisa la configuración del skill antes de usarlo.

Revisa la configuración

Usa la vía de instalación documentada en el repositorio y conserva los archivos complementarios a los que se haga referencia. Esta entrada describe un método de diseño concreto, no una aplicación ejecutable.

Archivo fuente original
https://github.com/Owl-Listener/designer-skills/blob/9a6930cf84a822eb458624bd11c61aac5bbdf224/ui-design/skills/typography-scale/SKILL.md

Requiere los archivos de fuente reales o las fuentes disponibles de la plataforma para una validación visual significativa.

Empieza con un entregable

Adapta el alcance, el material de origen y las restricciones de este brief antes de ejecutar el skill.

Brief de ejemplo
Usa typography-scale para una app de lectura de investigación con texto de artículos, notas, etiquetas de navegación y fragmentos de código. Define una escala modular sobria con valores de estilo completos y el comportamiento de los encabezados en móvil. Prueba con los títulos y párrafos largos proporcionados, no con texto de relleno.

Inspecciona el resultado

Comprueba el resultado real con estos criterios observables.

  • Cada estilo incluye algo más que un valor de tamaño de fuente.
  • Los roles de texto frecuentes usan un conjunto limitado de estilos.
  • Los encabezados largos y el texto de cuerpo siguen siendo legibles en anchos estrechos.

OpenDesign ofrece un espacio de trabajo de diseño local para agentes de programación. Este listado no significa que el skill incluya sus herramientas externas, credenciales ni dependencias de software.

05 Fuente y licencia

Fuente y licencia

Esta página describe la revisión fijada de la fuente enlazada abajo. El comportamiento y los requisitos originales pueden cambiar.

Propietario de la fuente
Owl-Listener
Licencia
MIT
Versión revisada
2026-10-07 · 9a6930cf84a8
Resumen editorial de la fuente
Una referencia de sistema tipográfico que abarca tamaños modulares, peso, interlineado, espaciado entre letras, roles de fuente y uso adaptable.

Resumen original de OpenDesign, basado en la fuente enlazada. Las estrellas del repositorio son una señal de popularidad fechada, no una medida de uso del skill ni una puntuación de calidad.

06 Preguntas antes de empezar

Preguntas antes de empezar

¿Una escala modular elige la fuente?

No. La proporción organiza los tamaños; la selección de la fuente y su renderizado real siguen requiriendo criterio.

¿Deben reducirse todos los tamaños de escritorio en móvil?

La fuente sugiere reducir los encabezados, mantener un tamaño de cuerpo legible y ajustar la longitud de línea.

¿Cuántos estilos deben usarse con regularidad?

La fuente recomienda limitar el uso habitual a un conjunto reducido y documentar roles adicionales, como leyendas o texto de display.

OpenDesign

Deja espacio para la próxima iteración de diseño.

Mantén juntos tu brief, el material de origen y tu trabajo de diseño en un espacio de trabajo local. Revisa la configuración propia del skill antes de añadirlo a tu flujo de trabajo.

Archivo fuente original
https://github.com/Owl-Listener/designer-skills/blob/9a6930cf84a822eb458624bd11c61aac5bbdf224/ui-design/skills/typography-scale/SKILL.md