GlobalStyles.js

/* fonts */
import {
  verticalScale,
  horizontalScale,
  moderateScale,
} from './src/utils/metrics';
export const FontFamily = {
  boldFootnote13pt: 'Source Sans Pro',
  regularFootnote13pt: 'Open Sans',
  boldHeading128pt: 'Satoshi Variable_bold',
  rubikBold: 'Rubik_bold',
  defaultRegularBody: 'Roboto Condensed',
  defaultBoldBody: 'Roboto',
};
/* font sizes */
export const FontSize = {
  boldFootnote13pt_size: 13,
  size_base: 16,
  boldHeading128pt_size: 28,
  size_lg: 18,
  defaultRegularBody_size: 17,
  boldDisplay34Pt_size: 34,
};
/* Colors */
export const Color = {
  neutral50: '#f9fafa',
  labelColorLightPrimary: '#000',
  primary400: '#2791b5',
  mainColorsWhite: '#fff',
  primary600: '#265565',
  primary800: '#134555',
  primaryPastelGreen: '#ccf593',
  textPlaceholder: '#d6d6d6',
  lightgray_100: '#ccc',
  neutral700: '#576b74',
  gray_100: '#222',
  primary8001: '#10242b',
  neutral900: '#0c212c',
  fillColorLightTertiary: 'rgba(118, 118, 128, 0.12)',
  mainGreen: '#8eb26f',
  neutral300: '#d6dadb',
  neutral500: '#94a5ab',
};
/* Paddings */
export const Padding = {
  p_98xl: horizontalScale(55),
  p_base: 16,
  p_9xs: 4,
  p_3xs: 10,
  p_xs: 12,
  p_5xs: 8,
  p_6xs: 7,
  p_sm: 14,
  p_90xl: 109,
};
/* border radiuses */
export const Border = {
  br_81xl: 100,
  br_xs: 12,
  br_xl: 20,
  br_5xs: 8,
  br_3xs: 10,
  br_7xs: 6,
  br_5xl: 24,
};