style.js

export const color = {
  black: '#000000',
  white: '#FFFFFF',
  whiteBg: '#F5F5F5',
  grey: '#C5C8CF',
  greyText: '#969596',
  greyPill: '#979797',
  greyListHeader: '#848A99',
  greyListLabel: '#DBDBDB',
  greyPlaceholder: 'rgba(74,74,74,0.5)',
  greyBorder: '#6B6969',
  greyLight: '#D7D4D4',
  purple: '#57038D',
  lightPurple: '#A540CD',
  loadNetworkLightPurple: '#A95BDC',
  loadNetworkMedPurple: '#651399',
  loadNetworkMedDarkPurple: '#610F96',
  openChansDarkPurple: '#6B249C',
  orange: '#F66B1C',
  blackDark: '#252F4A',
  blackText: '#4A4A4A',
  greenSig: '#46E80E',
  orangeSig: '#FF7C00',
  pinkSig: '#F5406E',
  blueSig: '#002FFF',
  glas: 'rgba(255,255,255,0.13)',
  glasDark: 'rgba(255,255,255,0.08)',
  glasDarker: 'rgba(255,255,255,0.04)',
  notifyDark: 'rgba(37,47,74,0.5)',
  notifyLight: 'rgba(255,255,255,0.5)',
  seedBorder: 'rgba(151,151,151,0.26)',
  seedBackground: 'rgba(130,129,129,0.09)',
  cliBackground: '#171D2C',
};

export const font = {
  sizeXS: 10,
  sizeS: 12,
  sizeSub: 14,
  sizeBase: 16,
  sizeM: 18,
  sizeL: 20,
  sizeXXL: 40,
  sizeXXXL: 80,
  lineHeightXS: 14,
  lineHeightS: 16,
  lineHeightSub: 18,
  lineHeightBase: 20,
  lineHeightM: 22,
  lineHeightL: 24,
  lineHeightXXL: 60,
  lineHeightXXXL: 100,
};

export const fontFamily = {
  WorkSansExtraLight: {
    name: 'WorkSans ExtraLight',
    widthHeightRatio: {
      '0': 0.596,
      '1': 0.333,
      '2': 0.543,
      '3': 0.533,
      '4': 0.561,
      '5': 0.544,
      '6': 0.555,
      '7': 0.507,
      '8': 0.572,
      '9': 0.577,
      '.': 0.186,
      default: 0.793,
    },
  },
};