@aesthetic/design-systems
Version:
Collection of design systems, including Aesthetic's.
306 lines (303 loc) • 5.73 kB
text/typescript
/* Auto-generated by Aesthetic. Do not modify! */
/* eslint-disable */
import design from '..';
export default design.createTheme(
{
contrast: 'normal',
scheme: 'light',
},
{
palette: {
brand: {
color: {
'00': '#e8eaf6',
'10': '#c5cae9',
'20': '#9fa8da',
'30': '#7986cb',
'40': '#5c6bc0',
'50': '#3f51b5',
'60': '#3949ab',
'70': '#303f9f',
'80': '#283593',
'90': '#1a237e',
},
bg: {
base: '#303f9f',
focused: '#303f9f',
hovered: '#1a237e',
selected: '#283593',
disabled: '#e0e0e0',
},
fg: {
base: '#fff',
focused: '#fff',
hovered: '#fff',
selected: '#fff',
disabled: '#9e9e9e',
},
text: '#303f9f',
},
primary: {
color: {
'00': '#e3f2fd',
'10': '#bbdefb',
'20': '#90caf9',
'30': '#64b5f6',
'40': '#42a5f5',
'50': '#2196f3',
'60': '#1e88e5',
'70': '#1976d2',
'80': '#1565c0',
'90': '#0d47a1',
},
bg: {
base: '#1976d2',
focused: '#1976d2',
hovered: '#0d47a1',
selected: '#1565c0',
disabled: '#e0e0e0',
},
fg: {
base: '#fff',
focused: '#fff',
hovered: '#fff',
selected: '#fff',
disabled: '#9e9e9e',
},
text: '#1976d2',
},
secondary: {
color: {
'00': '#fce4ec',
'10': '#f8bbd0',
'20': '#f48fb1',
'30': '#f06292',
'40': '#ec407a',
'50': '#e91e63',
'60': '#d81b60',
'70': '#c2185b',
'80': '#ad1457',
'90': '#880e4f',
},
bg: {
base: '#c2185b',
focused: '#c2185b',
hovered: '#880e4f',
selected: '#ad1457',
disabled: '#e0e0e0',
},
fg: {
base: '#fff',
focused: '#fff',
hovered: '#fff',
selected: '#fff',
disabled: '#9e9e9e',
},
text: '#c2185b',
},
tertiary: {
color: {
'00': '#fafafa',
'10': '#f5f5f5',
'20': '#eeeeee',
'30': '#e0e0e0',
'40': '#bdbdbd',
'50': '#9e9e9e',
'60': '#757575',
'70': '#616161',
'80': '#424242',
'90': '#212121',
},
bg: {
base: '#e0e0e0',
focused: '#e0e0e0',
hovered: '#9e9e9e',
selected: '#bdbdbd',
disabled: '#e0e0e0',
},
fg: {
base: '#424242',
focused: '#212121',
hovered: '#212121',
selected: '#212121',
disabled: '#9e9e9e',
},
text: '#616161',
},
neutral: {
color: {
'00': '#fafafa',
'10': '#f5f5f5',
'20': '#eeeeee',
'30': '#e0e0e0',
'40': '#bdbdbd',
'50': '#9e9e9e',
'60': '#757575',
'70': '#616161',
'80': '#424242',
'90': '#212121',
},
bg: {
base: '#616161',
focused: '#616161',
hovered: '#212121',
selected: '#424242',
disabled: '#e0e0e0',
},
fg: {
base: '#fff',
focused: '#fff',
hovered: '#fff',
selected: '#fff',
disabled: '#9e9e9e',
},
text: '#616161',
},
muted: {
color: {
'00': '#eceff1',
'10': '#cfd8dc',
'20': '#b0bec5',
'30': '#90a4ae',
'40': '#78909c',
'50': '#607d8b',
'60': '#546e7a',
'70': '#455a64',
'80': '#37474f',
'90': '#263238',
},
bg: {
base: '#455a64',
focused: '#455a64',
hovered: '#263238',
selected: '#37474f',
disabled: '#e0e0e0',
},
fg: {
base: '#fff',
focused: '#fff',
hovered: '#fff',
selected: '#fff',
disabled: '#9e9e9e',
},
text: '#455a64',
},
danger: {
color: {
'00': '#fff3e0',
'10': '#ffe0b2',
'20': '#ffcc80',
'30': '#ffb74d',
'40': '#ffa726',
'50': '#ff9800',
'60': '#fb8c00',
'70': '#f57c00',
'80': '#ef6c00',
'90': '#e65100',
},
bg: {
base: '#f57c00',
focused: '#f57c00',
hovered: '#e65100',
selected: '#ef6c00',
disabled: '#e0e0e0',
},
fg: {
base: '#fff',
focused: '#fff',
hovered: '#fff',
selected: '#fff',
disabled: '#9e9e9e',
},
text: '#f57c00',
},
warning: {
color: {
'00': '#fbe9e7',
'10': '#ffccbc',
'20': '#ffab91',
'30': '#ff8a65',
'40': '#ff7043',
'50': '#ff5722',
'60': '#f4511e',
'70': '#e64a19',
'80': '#d84315',
'90': '#bf360c',
},
bg: {
base: '#e64a19',
focused: '#e64a19',
hovered: '#bf360c',
selected: '#d84315',
disabled: '#e0e0e0',
},
fg: {
base: '#fff',
focused: '#fff',
hovered: '#fff',
selected: '#fff',
disabled: '#9e9e9e',
},
text: '#e64a19',
},
negative: {
color: {
'00': '#ffebee',
'10': '#ffcdd2',
'20': '#ef9a9a',
'30': '#e57373',
'40': '#ef5350',
'50': '#f44336',
'60': '#e53935',
'70': '#d32f2f',
'80': '#c62828',
'90': '#b71c1c',
},
bg: {
base: '#d32f2f',
focused: '#d32f2f',
hovered: '#b71c1c',
selected: '#c62828',
disabled: '#e0e0e0',
},
fg: {
base: '#fff',
focused: '#fff',
hovered: '#fff',
selected: '#fff',
disabled: '#9e9e9e',
},
text: '#d32f2f',
},
positive: {
color: {
'00': '#e8f5e9',
'10': '#c8e6c9',
'20': '#a5d6a7',
'30': '#81c784',
'40': '#66bb6a',
'50': '#4caf50',
'60': '#43a047',
'70': '#388e3c',
'80': '#2e7d32',
'90': '#1b5e20',
},
bg: {
base: '#388e3c',
focused: '#388e3c',
hovered: '#1b5e20',
selected: '#2e7d32',
disabled: '#e0e0e0',
},
fg: {
base: '#fff',
focused: '#fff',
hovered: '#fff',
selected: '#fff',
disabled: '#9e9e9e',
},
text: '#388e3c',
},
},
},
);