Buy nowGet update

Colors

Latestv6.1.0v5
Customize theme colors

To customize global theme colors, update the following files:

  • src/theme/theme-config.ts
  • src/theme/core/palette.ts
src/theme/theme-config.ts
{
  "primary": {
    "lighter": "#C8FAD6",
    "light": "#5BE49B",
    "main": "#00A76F",
    "dark": "#007867",
    "darker": "#004B50",
    "contrastText": "#FFFFFF"
  },
  // ...other colors
}
Color tools & references

Eva design colors (recommended)

Another great tool for generating harmonious palettes:

🔗 colors.eva.design

👉 Recommended token mapping:

  • 100 → lighter
  • 300 → light
  • 500 → main
  • 700 → dark
  • 900 → darker

Material UI colors

Use the official Material UI color tool:

🔗 mui.com/customization/color

🔗 Reference: