Government of Spain Dintel, Sistema de Diseño Standardized Design of Electronic Procedures Start First steps Foundations Components Modules Templates Tokens Support
Modules Footer

Footer

Componente de pie de página conocido como un pie de página o un footer. It is a user interface element that is located at the end of a web page or mobile application.

Preview

Figma
footer preview

Main components

Links

Typology of footer

By default

This footer will be used by default

Display of the default footer behavior
By default

Simple

In this reduced version, only the service logo and Copyright will be displayed.

Visualization of simple footer behavior
Simple

Colour

Negative

It will be used in portals intended for citizens

Footer display with negative color
Negative

Positive

It will be used in the portals intended for administration workers.

Footer display with positive color
Positive

Logo

Logo format

The logos will be placed in a 180x40px container, adjusting in height, that is, they will always have a height of 40px and the width will be flexible as long as it comes within that width of 180px

logo1
logo1
logo3

Arrangement of logos

For XL and LG resolutions, a maximum of 6 logos per row will be displayed. As many rows as necessary will be created. For the MD resolution a maximum of 4 logos per row will be displayed. For SM and XS resolutions, a maximum of 2 logos per row will be displayed.
Visualization of the layout of logos in a line in the footer of pages
A line
Display of the layout of logos in two lines in the footer of pages
Two lines

Responsive

Display of footer behavior on desktop size screens
Desktop
Display of footer behavior on mobile-sized screens
Mobile
Funded by the European Union NextGenerationEU, opens in new tab Recovery Plan, Transformation and Resilience, opens in new tab Digital Spain, opens in new tab Support Accessibility Web Map Cookies Policy

This website uses its own and third-party cookies to offer a better service. If you continue browsing, we consider that you accept its use.