Sistema de Diseño

Proyecto RAMS - Instituto Tecnológico San Mateo


HTML/CSS/SASS - Marzo - Abril, 2023

Colores Primarios

$azul #1E2155

$amarillo #F8D849

$amarillo-hover #DCB504

Escala de grises

$gris-10 #F7F7F7 background color sitio

$gris-05 #F0F0F0 borde contenedores

$gris-20 #DEDEDE

$gris-30 #C3C2C2

$gris-40 #B9B9B9

$gris-50 #BABABA

$gris-80 #636566

$negro #000000

Tipografía

Montserrat (Google Fonts)

Titular h1 - 3rem (1rem 10px)

Titular h2 - 2.6rem (1rem 10px)

Titular h3 - 1.9rem (1rem 10px)

Titular h4 - 1.7rem (1rem 10px)

Titular h5 - 1.4rem (1rem 10px)

Párrafo - 1.4rem (1rem 10px) Lorem ipsum dolor sit amet, consectetur adipisicing elit. Provident, porro esse! Animi saepe, laboriosam, quis eius atque voluptates quod soluta eum dolores magni numquam iure voluptatum, ea cumque praesentium! Illo?. Muy lejos, más allá de las montañas de palabras, viven los textos simulados.

  • Aenean leo ligula, porttitor eu, consequat vitae, eleifend ac, enim. Aliquam lorem ante, dapibus in, viverra quis, feugiat a, tellus. Phasellus viverra nulla ut metus varius laoreet. Quisque rutrum. Aenean imperdiet. Etiam ultricies nisi vel augue. Curabitur ullamcorper ultricies nisi.
  • Aenean leo ligula, porttitor eu, consequat vitae, eleifend ac, enim.
  • Aenean leo ligula, porttitor eu, consequat vitae, eleifend ac, enim.
  • Aenean leo ligula, porttitor eu, consequat vitae, eleifend ac, enim.
  1. Aenean leo ligula, porttitor eu, consequat vitae, eleifend ac, enim.
  2. Aenean leo ligula, porttitor eu, consequat vitae, eleifend ac, enim.
  3. Aenean leo ligula, porttitor eu, consequat vitae, eleifend ac, enim.
Botones
Botón Primario
Primario Gris
Botón Secundario
Agregar
Enlace con icono
Formulario: Input
Formulario: Select menú
Select Menú
Select Menú disabled
Formulario: Textarea
Formulario: radiobutton
Formulario: checkbox
Formulario: switch
Tabla - Ejemplo - 1

Título del contenedor

Crear nuevo paso
Nombre R.U.T. Opciones
Luis Alejandro Hermosilla Pérez 18.947.947-0
Patricia Alejandra Álvarez Martínez 21.587.900-5
Paola Macarena Prado González 20.109.354-K
Juan Francisco González Pérez 22.134.567.2
Catalina Sofía Rodríguez Aguilera 21.867.847-0
Tabla - Ejemplo - 2

Título del contenedor

Crear nuevo paso
Cancelar
Nombre R.U.T. Opciones
Luis Alejandro Hermosilla Pérez 18.947.947-0
Patricia Alejandra Álvarez Martínez 21.587.900-5
Paola Macarena Prado González 20.109.354-K
Juan Francisco González Pérez 22.134.567.2
Catalina Sofía Rodríguez Aguilera 21.867.847-0
Tabla - Ejemplo - 3

Título del contenedor

Tipo de enseñanza*
Nombre R.U.T. Opciones
Luis Alejandro Hermosilla Pérez 18.947.947-0
Patricia Alejandra Álvarez Martínez 21.587.900-5
Paola Macarena Prado González 20.109.354-K
Juan Francisco González Pérez 22.134.567.2
Catalina Sofía Rodríguez Aguilera 21.867.847-0
Crear nuevo paso
Cancelar
Iconos
Tamaños Iconos
16pxx16px
24pxx24px
32pxx32px
48pxx48px
100pxx100px
120pxx120px
150pxx150px