Demonstration and documentation

Consistent colours help us achieve a consistent EMBL-EBI "look". You can use a standard reday-made colour palette that we provide or some projects may want to use a custom palette.

We provide these basic colour palettes that will be of use for many projects:

EBI Petrol

The default.
Found at css/theme-embl-petrol.css
Test link
Test button

Services

Close to EBI Petrol.
Found at css/theme-ebi-services-about.css
Test link
Test button

Research

Green.
Found at css/theme-ebi-research.css
Test link
Test button

Training

Golden.
Found at css/theme-ebi-training.css
Test link
Test button

Industry

Bright blue ocean.
Found at css/theme-ebi-training.css
Test link
Test button

You can call these colours directly with these colour and background-colour classes:

  .ebi-background { background: rgb(0,124,130); }
  .services-background { background: rgb(2,100,105); }
  .research-background { background: rgb(168,200,19); }
  .training-background { background: rgb(233,180,0); }
  .industry-background { background: rgb(0,134,180); }
  .elixir-background { background: rgb(251,106,42); }
  .white-background { background: rgb(255,255,255); }
  
  .ebi-color { color: rgb(0,124,130); }
  .services-color { color: rgb(2,100,105); }
  .research-color { color: rgb(168,200,19); }
  .training-color { color: rgb(233,180,0); }
  .industry-color { color: rgb(0,134,180); }
  .elixir-color { color: rgb(251,106,42); }
  .white-color { color: rgb(255,255,255); }

Note: we recommend using the RGB values (support is near-universal. The alpha, RGBA mode, is available from IE 9.)

Roll your own colors

Individual service team websites can use their own colour palettes by supplying a CSS file.

A number of pre-made colour themese are available for use, and as a template to make your owm:

Advanced users can also build their own custom colours into the ebi-global.css file by modifying _ebi_theme_settings.scss.