Guía de estilos

Logotipo con el texto «grupo vvg» en gris, con «grupo vvg» en vertical a la izquierda y las letras grandes «GV».

Color

HEX #2c2c2c

HEX #484b53

HEX #f8f8f7

HEX #fce632

Tipografía

Lato


ABCDEFGHIJKLMNÑOPQRSTUVWXYZ

abcdefghijklmnñopqrstuvwxyz

1234567890 ¿?¡!@_*()


ABCDEFGHIJKLMNÑOPQRSTUVWXYZ

abcdefghijklmnñopqrstuvwxyz

1234567890 ¿?¡!@_*()


ABCDEFGHIJKLMNÑOPQRSTUVWXYZ

abcdefghijklmnñopqrstuvwxyz

1234567890 ¿?¡!@_*()

Títulos / Encabezados

Heading 1 - Bold, 40px / 1.5 / #213f62

Heading 2 - Bold, 30px / 1.5 / #213f62

Heading 3 - Bold, 24px / 1.5 / #213f62

Heading 4 - Bold, 18px / 1.5 / #213f62

Heading 5, 16px / 1.5 / #213f62
Heading 6, 14px / 1.5 / #213f62

Tipografía / Párrafos

Roboto, 14px / 1.2 / #213f62


Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit 

Roboto Bold, 14px / 1.2 / #213f62


Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.

Botones

Botón Primario

Normal Active Hover

Rounded corners

50%

Botón Secundario

Normal Active Hover

Botones de texto

Flecha rosa hacia arriba y a la derecha dentro de un círculo rosa sobre fondo blanco

Hipervínculo

Hipervínculo

Hipervínculo

Fotografías / Imágenes

Concepto: Fotografías de los proyectos en tamaño no mejor a 1920 px. Utilizar un Ovarlay del 20% en tono #484b53 en los banners para generar contraste con texto blanco.

Casa moderna de dos plantas, de color gris, con grandes ventanales y un jardín ajardinado a la luz del día
Salón moderno con grandes ventanales, muebles en tonos neutros, suelo de madera y una mesa de comedor en primer plano

Iconos

Icono del contorno de una casa con cuatro ventanas y una chimenea, dibujado con líneas de color gris
Una mano haciendo el gesto de aprobación dentro del contorno de una casa, en gris oscuro sobre un fondo blanco
Mano sosteniendo un icono de una casa, símbolo de apoyo o asistencia para la vivienda
Dos edificios delineados: un pequeño edificio de oficinas delante de un icono de rascacielos más alto




Los iconos deben tener un fondo circular color blanco, deben ser trabajados en línea de color HEX #484b53

Icono del contorno de una casa con cuatro ventanas y una chimenea, dibujado con líneas de color gris

Spacing

Token

$spacing-01

$spacing-02

$spacing-03

$spacing-04

$spacing-05



$spacing-06

px

5

15

30

50

70



100

Formulario / Campo

Lorem ipsum:

New Paragraph

Lorem ipsum:

Lorem Ipsum