# 10\_Sistema de diseño

![](https://3503706417-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MNDDxhk8pEs40l281Pv%2F-MNJb2c-Eq5pFnk1PuTt%2F-MNK_tzenVGajPV-E78d%2FHoja%20de%20estilos.png?alt=media\&token=d6376bd4-a3ba-405f-af8a-474fedeeb0fd)

Con el fin de **dar más consistencia** a la página he empleado **un orden de escala y estilos de diseño** de colores, iconos y componentes.

Para la **tipografía** he empleado **una escala tipográfica proporcional de 1.2** entre todos los tamaños. De esta manera mejoro la **jerarquía visual tipográfica** de la página. 

A los **colores** tenemos **los primarios** que son los azules de la marca, **los secundarios** con sus colores de fondo y la escala de grises y **los colores semánticos** para indicar *true, false, notificación y aviso*. Y además, he agregado **el degradado** que se emplean en algunos elementos como el cuadro médico.

Los **iconos** que he elegido, han sido acorde al elemento o texto al que acompañan. Es decir poseen **consistencia entre sí** y **también con su entorno**.

Los **botones** han sido rediseñados todos con un **border radius de 50** que también se aplicará a los **campos de formulario**.