Exporting custom material theme builder from Figma, how do I import and use the colours in React?

29 views Asked by At

So I have a json file with dark and light theme colours: It looks something like this.

"schemes": {
        "light": {
            "primary": "#3C6090",
            "surfaceTint": "#3C6090",
            "onPrimary": "#FFFFFF",
            "primaryContainer": "#D4E3FF",
            "onPrimaryContainer": "#001C3A",

It's an export from material theme builder from a Figma mockup, and I want to use in React. Where do I put this JSON file, and do I actually use these colours in a Material 3 Web component?

I've tried searching this issue, but Material 3 Web is relatively new - doesn't look like there's a lot of documentation. I've found a solution which involves loading into the Adobe XD VSCode plugin, but I don't think that plug in still exists, I can't find it if I look it up on the VSCode extensions page.

0

There are 0 answers