Colors / colours

By Ken Hawkins

visuals colour branding Requires EBI Visual Framework 1.1.0, 1.2.0

Core EMBL-EBI colours.

Contribute a pattern

Have a great way of doing something, add it to the Style Lab. Here's how


Implementation code

Get a zip with all the sample HTML and any spaecial CSS or JS needed: Download a ZIP file More on how to use this

HTML
<p>
<div class="row small-up-1 medium-up-2 large-up-3" data-equalizer>
  <div class="column ebi-background white-color" data-equalizer-watch>
    <p><h4 class="white-color">EBI Petrol</h4> The default. <br/>
      <small>
        Found at css/theme-embl-petrol.css
        <br/><a href="#">Test link</a>
        <br/><a class="button white-background ebi-color" href="#">Test button</a>
      </small>
    </p>
  </div>
  <div class="column services-background white-color" data-equalizer-watch>
    <p><h4 class="white-color">Services</h4> Close to EBI Petrol. <br/>
      <small>
        Found at css/theme-ebi-services-about.css
        <br/><a href="#">Test link</a>
        <br/><a class="button white-background services-color" href="#">Test button</a>
      </small>
    </p>
  </div>
  <div class="column research-background white-color" data-equalizer-watch>
    <p><h4 class="white-color">Research</h4> Green. <br/>
      <small>
        Found at css/theme-ebi-research.css
        <br/><a href="#">Test link</a>
        <br/><a class="button white-background research-color" href="#">Test button</a>
      </small>
    </p>
  </div>
  <div class="column training-background white-color" data-equalizer-watch>
    <p><h4 class="white-color">Training</h4> Golden. <br/>
      <small>
        Found at css/theme-ebi-training.css
        <br/><a href="#">Test link</a>
        <br/><a class="button white-background training-color" href="#">Test button</a>
      </small>
    </p>
  </div>
  <div class="column industry-background white-color" data-equalizer-watch>
    <p><h4 class="white-color">Industry</h4> Bright blue ocean. <br/>
      <small>
        Found at css/theme-ebi-training.css
        <br/><a href="#">Test link</a>
        <br/><a class="button white-background industry-color" href="#">Test button</a>
      </small>
    </p>
  </div>
</div>
</p>



JS