createTheme

Unhandled Runtime Error
Error: MUI: Unsupported var(--primary-500) color.
The following formats are supported: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla(), color().

Material-UI에서 테마를 설정할 때 CSS 변수를 사용하는 대신 직접 색상 값을 지정해야 합니다. 현재 Material-UI는 CSS 변수를 지원하지 않습니다. 따라서 직접 색상 값을 지정하여 테마를 설정해야 합니다.

const theme = createTheme({
  typography: {
    fontFamily: notoSansKr.style.fontFamily,
  },
  palette: {
    primary: {
      main: "rgba(20, 129, 225, 1)", // 변경된 부분
    },
    secondary: {
      main: "var(--secondary-500)",
    },
    ...

별 거 아니었다...