New

We launched a new template based on Joy UI

See
logo
Purchase now

Colors

Text colors
  • Text primary
    var(--mui-palette-text-primary)
  • Text secondary
    var(--mui-palette-text-secondary)
  • Text disabled
    var(--mui-palette-text-disabled)
Primary colors
  • Primary light
    var(--mui-palette-primary-light)
  • Primary main
    var(--mui-palette-primary-main)
  • Primary dark
    var(--mui-palette-primary-dark)
  • Primary 50
    var(--mui-palette-primary-50)
  • Primary 100
    var(--mui-palette-primary-100)
  • Primary 200
    var(--mui-palette-primary-200)
  • Primary 300
    var(--mui-palette-primary-300)
  • Primary 400
    var(--mui-palette-primary-400)
  • Primary 500
    var(--mui-palette-primary-500)
  • Primary 600
    var(--mui-palette-primary-600)
  • Primary 700
    var(--mui-palette-primary-700)
  • Primary 800
    var(--mui-palette-primary-800)
  • Primary 900
    var(--mui-palette-primary-900)
  • Primary 950
    var(--mui-palette-primary-950)
Secondary colors
  • Secondary light
    var(--mui-palette-secondary-light)
  • Secondary main
    var(--mui-palette-secondary-main)
  • Secondary dark
    var(--mui-palette-secondary-dark)
  • Secondary 50
    var(--mui-palette-secondary-50)
  • Secondary 100
    var(--mui-palette-secondary-100)
  • Secondary 200
    var(--mui-palette-secondary-200)
  • Secondary 300
    var(--mui-palette-secondary-300)
  • Secondary 400
    var(--mui-palette-secondary-400)
  • Secondary 500
    var(--mui-palette-secondary-500)
  • Secondary 600
    var(--mui-palette-secondary-600)
  • Secondary 700
    var(--mui-palette-secondary-700)
  • Secondary 800
    var(--mui-palette-secondary-800)
  • Secondary 900
    var(--mui-palette-secondary-900)
  • Secondary 950
    var(--mui-palette-secondary-950)
Success colors
  • Success light
    var(--mui-palette-success-light)
  • Success main
    var(--mui-palette-success-main)
  • Success dark
    var(--mui-palette-success-dark)
  • Success 50
    var(--mui-palette-success-50)
  • Success 100
    var(--mui-palette-success-100)
  • Success 200
    var(--mui-palette-success-200)
  • Success 300
    var(--mui-palette-success-300)
  • Success 400
    var(--mui-palette-success-400)
  • Success 500
    var(--mui-palette-success-500)
  • Success 600
    var(--mui-palette-success-600)
  • Success 700
    var(--mui-palette-success-700)
  • Success 800
    var(--mui-palette-success-800)
  • Success 900
    var(--mui-palette-success-900)
  • Success 950
    var(--mui-palette-success-950)
Info colors
  • Info light
    var(--mui-palette-info-light)
  • Info main
    var(--mui-palette-info-main)
  • Info dark
    var(--mui-palette-info-dark)
  • Info 50
    var(--mui-palette-info-50)
  • Info 100
    var(--mui-palette-info-100)
  • Info 200
    var(--mui-palette-info-200)
  • Info 300
    var(--mui-palette-info-300)
  • Info 400
    var(--mui-palette-info-400)
  • Info 500
    var(--mui-palette-info-500)
  • Info 600
    var(--mui-palette-info-600)
  • Info 700
    var(--mui-palette-info-700)
  • Info 800
    var(--mui-palette-info-800)
  • Info 900
    var(--mui-palette-info-900)
  • Info 950
    var(--mui-palette-info-950)
Warning colors
  • Warning light
    var(--mui-palette-warning-light)
  • Warning main
    var(--mui-palette-warning-main)
  • Warning dark
    var(--mui-palette-warning-dark)
  • Warning 50
    var(--mui-palette-warning-50)
  • Warning 100
    var(--mui-palette-warning-100)
  • Warning 200
    var(--mui-palette-warning-200)
  • Warning 300
    var(--mui-palette-warning-300)
  • Warning 400
    var(--mui-palette-warning-400)
  • Warning 500
    var(--mui-palette-warning-500)
  • Warning 600
    var(--mui-palette-warning-600)
  • Warning 700
    var(--mui-palette-warning-700)
  • Warning 800
    var(--mui-palette-warning-800)
  • Warning 900
    var(--mui-palette-warning-900)
  • Warning 950
    var(--mui-palette-warning-950)
Error colors
  • Error light
    var(--mui-palette-error-light)
  • Error main
    var(--mui-palette-error-main)
  • Error dark
    var(--mui-palette-error-dark)
  • Error 50
    var(--mui-palette-error-50)
  • Error 100
    var(--mui-palette-error-100)
  • Error 200
    var(--mui-palette-error-200)
  • Error 300
    var(--mui-palette-error-300)
  • Error 400
    var(--mui-palette-error-400)
  • Error 500
    var(--mui-palette-error-500)
  • Error 600
    var(--mui-palette-error-600)
  • Error 700
    var(--mui-palette-error-700)
  • Error 800
    var(--mui-palette-error-800)
  • Error 900
    var(--mui-palette-error-900)
  • Error 950
    var(--mui-palette-error-950)
Neutral colors
  • Divider
    var(--mui-palette-divider)
  • Neutral 50
    var(--mui-palette-neutral-50)
  • Neutral 100
    var(--mui-palette-neutral-100)
  • Neutral 200
    var(--mui-palette-neutral-200)
  • Neutral 300
    var(--mui-palette-neutral-300)
  • Neutral 400
    var(--mui-palette-neutral-400)
  • Neutral 500
    var(--mui-palette-neutral-500)
  • Neutral 600
    var(--mui-palette-neutral-600)
  • Neutral 700
    var(--mui-palette-neutral-700)
  • Neutral 800
    var(--mui-palette-neutral-800)
  • Neutral 900
    var(--mui-palette-neutral-900)
  • Neutral 950
    var(--mui-palette-neutral-950)