--color-primary-light
Color
Primary Light
Primary
--color-primary
Primary Dark
--color-primary-dark
Secondary Light
--color-secondary-light
Secondary
--color-secondary
Secondary Dark
--color-secondary-dark
Error Light
--color-error-light
Error
--color-error
Error Dark
--color-error-dark
Warning Light
--color-warning-light
Warning
--color-warning
Warning Dark
--color-warning-dark
Success Light
--color-success-light
Success
--color-success
Success Dark
--color-success-dark
Light
--color-light
Black
--color-black
Dark
--color-dark
Default
--color-default
Gray
--color-gray
Border
--color-border
Snow
--color-snow
Mui Component
config.layout.tsx : setting style
const themePalette = { primary : {
light : '#176aaf', // --color-primary-light
main : '#0f4d81', // --color-primary
dark : '#003764', // --color-primary-dark
}, secondary : {
light : '#fcc761', // --color-secondary-light
main : '#ffa800', // --color-secondary
dark : '#a46c00', // --color-secondary-dark
}, error : {
light : '#ff2626', // --color-error-light
main : '#f00', // --color-error
dark : '#da0000', // --color-error-dark
}, warning : {
light : '#ff6c6d', // --color-warning-light
main : '#ec4546', // --color-warning
dark : '#c43839', // --color-warning-dark
}, success : {
light : '#50ffa0', // --color-success-light
main : '#00e066', // --color-success
dark : '#00b552', // --color-success-dark
}, info : {
light : '#999', // --color-gray
main : '#666', // --color-default
dark : '#333', // --color-dark
}, common : {
black : '#111', // --color-black
white : '#fff', // --color-light
},};