EGI Federation Home

EGI Check-in Button Configuration for Developers

The EGI Check-in Login and Sign-up buttons that come with our Software Development kit are easy to integrate and include built-in guidelines that ensure a consistent design and experience across different apps and systems using the EGI Check-in service.

Assets

These are the assets necessary to create the buttons. The EGI logo is presented as an SVG file, which mean it has a limitless scalability.
EGI Logo Colored

format: svg file

Right click this file and select download.

EGI Logo White

format: svg file

Right click this file and select download.

DM SANS

Typeface
format: google fonts or local

Connect your application to Google Fonts. Or- if your application supports local typefaces, you can download it from Google Fonts and host it on your server.

Button Blue Border

HTML Code

The following HTML code is the base for all blue border buttons. Add one of these on the location you would like to display the button.
<a href="#linkhere" class="button-blue-border">Sign in with EGI Check-in<a>
<a href="#linkhere" class="button-blue-border">Login with EGI Check-in<a>
<a href="#linkhere" class="button-blue-border">Continue with EGI Check-in<a>

Approved Usages

The following are static previews of the approved usages for the sign up, login and continue with EGI check-in variants.

EGI Check-in buttons white

Button Blue Background

HTML Code

The following HTML code is the base for all blue background buttons. Add one of these on the location you would like to display the button.
<a href="#linkhere" class="button-blue-background">Sign in with EGI Check-in<a>
<a href="#linkhere" class="button-blue-background">Login with EGI Check-in<a>
<a href="#linkhere" class="button-blue-background">Continue with EGI Check-in<a>

Approved Usages

The following are static previews of the approved usages for the sign up, login and continue with EGI check-in variants.

EGI Check-in buttons blue