Tipografia

La tipografia en Nuvex UI se expone mediante clases publicas para jerarquia, roles de interfaz y contextos de texto especializados. Usa esta pagina para comparar cada clase visualmente, entender cuando aplicarla y copiar el mismo patron de markup mostrado en los snippets.

Abrir coloresAbrir superficies

Uso

Estos son los roles de texto base usados a lo largo de la interfaz. Cada card aplica una clase publica directamente sobre una muestra corta para que puedas copiar el mismo patron en labels, cards y texto de apoyo.

Lead
.type-lead
Heading
.type-heading
Title works well for cards, panels, and summary surfaces.
.type-title
Type Body
.type-body
Subtitle stays compact and dense for metadata or secondary labels.
.type-subtitle

Escala jerarquica

La escala de headings se expone mediante .type-h1 a .type-h6. Usala cuando la etiqueta HTML semantica no sea suficiente o cuando la composicion de UI requiera un estilo de heading sobre otro elemento.

Heading 1
.type-h1
Heading 2
.type-h2
Heading 3
.type-h3
Heading 4
.type-h4
Heading 5
.type-h5
Heading 6
.type-h6

Roles especializados

Algunos roles tipograficos se reservan para contextos mas acotados, como .type-dialog-title y .type-dialog-lead. Mantenlos en esos momentos de UI para que la jerarquia general siga siendo predecible.

Dialog title
.type-dialog-title
Dialog lead
.type-dialog-lead