Style Guide

This style guide is based on the EUAA visual identity and adapted to the specific requirements for web applications.

Differences to EUAA visual identity for print

Apart from this design system, the EUAA also has visual identity guidelines that have been created primarily for print. While the overall style across the web and print guidelines are the same, they differ in the following areas:

 

Colours

Due to web-accessibility guidelines, the brand colour yellow should be used only with careful consideration, e.g. on a background with sufficient contrast (for example dark blue). Never use yellow on white or vice versa.

 

Font

On the web the readily available web-font "Open Sans" should be used. The EUAA visual identity recommends using "Proxima Nova" for printed materials only.

 

Icons

The EUAA has a set of custom corporate icons that depict aslum related topics. While these icons are helpful for print and areas on the web with sufficient space (e.g. the image area of a card component, they might not always work in very small sizes on screens, like in a side navigation or on a button). That is why for UI components with limited space the icon sets of Font Awesome should be used. These icons also contain the Humanitarian icons of OCHA. Wherever possible, the svg version of an icon should be used.

 

All style guide topics