./colors
unknown
plain_text
9 months ago
2.5 kB
13
Indexable
export const metrisBlue = {
25: '#F3FBFF',
50: '#EAF5FF',
100: '#BFE1FF',
200: '#95CEFF',
300: '#6ABAFF',
400: '#40A6FF',
500: '#1592FF',
600: '#007BE6',
700: '#0066BF',
800: '#005095',
900: '#00396A',
1000: '#002240',
};
export const metrisGray = {
0: '#F8F9FA',
25: '#EEF0F4',
50: '#DDE1E8',
100: '#CBD3DD',
200: '#BAC4D1',
300: '#A9B5C6',
400: '#7D8FA9',
500: '#586A84',
600: '#455469',
700: '#3B4758',
800: '#313B49',
900: '#1D232C',
1000: '#161B21',
};
export const errorColor = {
25: '#FBEAEA',
50: '#F3C1BF',
100: '#EB9794',
200: '#E26E69',
300: '#DB4943',
400: '#DA453E',
500: '#C12B25',
600: '#96211D',
700: '#6B1814',
800: '#400E0C',
900: '#400E0C',
};
export const warningColor = {
25: '#FEF6E9',
50: '#FBE5BE',
100: '#F8D492',
200: '#F5C367',
300: '#F2B23B',
400: '#F2B035',
500: '#F0A10F',
600: '#C4840D',
700: '#98670A',
800: '#6D4907',
900: '#412C04',
};
export const successColor = {
25: '#EFF8EE',
50: '#D0EBCD',
100: '#B1DEAC',
200: '#92D08B',
300: '#73C36A',
400: '#54B649',
500: '#44953C',
600: '#387A31',
700: '#35742E',
800: '#265321',
900: '#224B1E',
};
export const rubyRed = {
50: '#FFB9D1',
200: '#FF5D94',
400: '#FA0E5A',
600: '#D10047',
800: '#740028',
};
export const forestGreen = {
50: '#CFEBCD',
200: '#90D08B',
400: '#5DBB56',
600: '#42953C',
800: '#255321',
};
export const cosmicPurple = {
50: '#D7BBFD',
200: '#A361FA',
400: '#7717F8',
600: '#5A06CA',
800: '#320370',
};
export const goldenTangerine = {
50: '#FEE1BB',
200: '#FCBA5F',
400: '#FCA632',
600: '#CD7703',
800: '#724202',
};
export const oceanicAzure = {
50: '#B9F7FF',
200: '#5DEDFF',
400: '#00E2FF',
600: '#0096A9',
800: '#006774',
};
export const sunflowerYellow = {
50: '##FDEEBB',
200: '#FBD760',
400: '#FACA2B',
600: '#CC9E05',
800: '#715803',
};
export const lime = {
50: '#EBFF95',
200: '#DCFF40',
400: '#BEEA00',
600: '#799500',
800: '#415000',
};
export const ultraPink = {
50: '#FABFFF',
200: '#F36AFF',
400: '#EB15FF',
600: '#AF00BF',
800: '#61006A',
};
export const fontWeight = {
light: '300',
regular: '400',
medium: '500',
semiBold: '600',
bold: '700',
extraBold: '800',
};
Editor is loading...
Leave a Comment