Colors

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:

https://minimals.cc/components/foundation/colors