Image

Digital
Brand
Identity

Color
Scheme

Primary Colors

Seriousness, Hope, Progress, Quality - Reflect Client side




Complementary colors

Dynamism, Youth, Energy - Reflect Candidate Side




Main Scheme

Balance between seriousness and dynamism. Sober result but vivid colors that bring back energy.




Typography

Main font - Montserrat

Sans Serif - Serious and classic - Easy readibility - Multiple Weights - Great flexibility

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque scelerisque posuere arcu ut eleifend. Donec auctor sagittis lectus, eu lobortis mi pulvinar quis.

Praesent sed sapien elit. Vivamus eget nisl at augue consequat maximus gravida eget dui. Nulla facilisi. Curabitur quis lectus libero. Nam nunc sapien, egestas a feugiat et, lobortis sit amet erat.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque scelerisque posuere arcu ut eleifend. Donec auctor sagittis lectus, eu lobortis mi pulvinar quis.

Praesent sed sapien elit. Vivamus eget nisl at augue consequat maximus gravida eget dui. Nulla facilisi. Curabitur quis lectus libero. Nam nunc sapien, egestas a feugiat et, lobortis sit amet erat.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque scelerisque posuere arcu ut eleifend. Donec auctor sagittis lectus, eu lobortis mi pulvinar quis.

Praesent sed sapien elit. Vivamus eget nisl at augue consequat maximus gravida eget dui. Nulla facilisi. Curabitur quis lectus libero. Nam nunc sapien, egestas a feugiat et, lobortis sit amet erat.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque scelerisque posuere arcu ut eleifend. Donec auctor sagittis lectus, eu lobortis mi pulvinar quis.

Praesent sed sapien elit. Vivamus eget nisl at augue consequat maximus gravida eget dui. Nulla facilisi. Curabitur quis lectus libero. Nam nunc sapien, egestas a feugiat et, lobortis sit amet erat.

Lorem ipsum dolor sit amet

Lorem ipsum dolor sit amet

Lorem ipsum dolor sit amet

Alt font - Garamond

Serif - Classic - Easy readibility - Restricted usage : block-quotes, specific needs.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque scelerisque posuere arcu ut eleifend. Donec auctor sagittis lectus, eu lobortis mi pulvinar quis.

Praesent sed sapien elit. Vivamus eget nisl at augue consequat maximus gravida eget dui. Nulla facilisi. Curabitur quis lectus libero. Nam nunc sapien, egestas a feugiat et, lobortis sit amet erat.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque scelerisque posuere arcu ut eleifend. Donec auctor sagittis lectus, eu lobortis mi pulvinar quis.

Praesent sed sapien elit. Vivamus eget nisl at augue consequat maximus gravida eget dui. Nulla facilisi. Curabitur quis lectus libero. Nam nunc sapien, egestas a feugiat et, lobortis sit amet erat.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque scelerisque posuere arcu ut eleifend. Donec auctor sagittis lectus, eu lobortis mi pulvinar quis.

Praesent sed sapien elit. Vivamus eget nisl at augue consequat maximus gravida eget dui. Nulla facilisi. Curabitur quis lectus libero. Nam nunc sapien, egestas a feugiat et, lobortis sit amet erat.

Image
"Lorem ipsum dolor sit amet, consectetur adipiscing elit."
Name - Job name

TOOLS

Buttons

Two shapes, Square for main purposes, and pills to bring flexibility and smoothness when needed.

Medias

Usage of Images and videos are not limited.
Make sure that readability is always the best while using medias as background.

Subjects on images should always be focused properly with no weird cut.

Image

This video received a 40% opacity blue shade to avoid white text being unreadable.

Usage of columns

We may use 4 columns, 3 columns or 2 columns set with different % width. Try avoiding more columns, as design may result in a cluncky way past certain breakpoints.

It is very important to give element within the column a 20px space to allow whites to spread and navigate through the webpage properly.

4 Columns

There is a 20px padding within the column box.

There is also a 20px space between each column.

3 Columns

There is a 20px padding within the column box.

There is also a 20px space between each column.

2 Columns

There is a 20px padding within the column box.

There is also a 20px space between each column.