My virtualColor definition has no -filled color.

[sedrik]

Hi

I have a virtualColor defines as follows.

      "second-background-light": colorsTuple("#ffffff"),
      "second-background-dark": colorsTuple(DEFAULT_THEME.colors.dark[6]),
      "second-background": virtualColor({
        name: "second-background",
        light: "second-background-light",
        dark: "second-background-lark",
      }),

I then apply it to a Flex object as the bg

<Flex h="100%" direction="column" bg="second-background">

But when I inspect the flex object in my browser it claims that var(--mantine-color-second-background-filled) is not defined. Did I missunderstand how I should setup a virtual color?

[sedrik]

Never mind this, I saw now that I had a spelling error in the dark background.