@visual-framework/vf-design-tokens/src/core.palette.alias.yml

A collection of design tokens for consumption across projects and products

aliases:

  # EMBL Green Colours

  vf-color--green: '#18974C'
  vf-color--green--darkest: '#0A5032'
  vf-color--green--dark: '#007B53'
  vf-color--green--light: '#6CC24A'
  vf-color--green--lightest: '#D0DEBB'

  # EMBL Grey

  vf-color--grey: '#707372'
  vf-color--grey--dark: '#54585A'
  vf-color--grey--darkest: '#373A36'
  vf-color--grey--light: '#A8A99E'
  vf-color--grey--lightest: '#D0D0CE'

  # EMBL Red Colours

  vf-color--red: '#D41645'
  vf-color--red--dark: '#A6093D'
  vf-color--red--light: '#E58F9E'

  # EMBL Blue Colours

  vf-color--blue: '#3B6FB6'
  vf-color--blue--dark: '#193f90'
  vf-color--blue--light: '#8BB8E8'

  # EMBL Purple Colours

  vf-color--purple: '#734595'
  vf-color--purple--dark: '#563D82'
  vf-color--purple--light: '#CBA3D8'

  # EMBL Orange Colours

  vf-color--orange: '#F49E17'
  vf-color--orange--dark: '#B65417'
  vf-color--orange--light: '#EFC06E'

  # EMBL Yellow Colours

  vf-color--yellow: '#F4C61F'
  vf-color--yellow--dark: '#FFB81C'
  vf-color--yellow--light: '#FDD757'

  # EMBL Bright Green Colours

  vf-color--bright-green: '#A1BE1F'
  vf-color--bright-green--dark: '#7FB428'
  vf-color--bright-green--light: '#E2E868'


  # EMBL Link Colours

  vf-color--link--dark-mode--hover: '#a8d2ff'
  vf-color--link--dark-mode--visited: '#a8d2ff'

  # VF Core Colours

  ui-color--black: 'rgb(0,0,0)'
  ui-color--grey: 'rgb(216,216,216)'
  ui-color--grey--light: 'rgb(243,243,243)'
  ui-color--yellow: 'rgb(255,250,220)'
  ui-color--red: 'rgb(211,47,47)'
  ui-color--white: 'rgb(255,255,255)'
  ui-color--off-white: 'rgb(250,250,250)'