Tokens not displayed in Figma and saving not working

[mmailaender]

Describe the bug
We have created Figma tokens. But after the last update, I'm not more able to see them.

Additionally, if I try to make a change and then close Figma tokens and reopen it again, my changes also disappeared.
Also, trying to pull from GitHub leads to no change.

My colleagues are seeing the design tokens on their side.

[six7]

My guess is the JSON is malformed on the storage, this usually happens when the plugin is unable to read the tokens. Can you post the .json?

[mmailaender]

But then I would expect, that it also should not work for my colleagues, or? Because for them, it's working, as written earlier.

{ "radius": { "none": { "value": "0", "type": "borderRadius" }, "xtiny": { "value": "4", "type": "borderRadius" }, "tiny": { "value": "8", "type": "borderRadius" }, "midsize": { "value": "12", "type": "borderRadius" }, "big": { "value": "20", "type": "borderRadius" }, "round": { "value": "999", "type": "borderRadius" } }, "font-family": { "value": "Montserrat", "type": "fontFamilies" }, "font": { "weight": { "medium": { "value": "Medium", "type": "fontWeights" }, "semibold": { "value": "SemiBold", "type": "fontWeights" }, "bold": { "value": "Bold", "type": "fontWeights" } }, "size": { "h1": { "value": "32px", "type": "fontSizes" }, "h2": { "value": "25px", "type": "fontSizes" }, "h3": { "value": "22px", "type": "fontSizes" }, "h4": { "value": "16px", "type": "fontSizes" }, "body": { "value": "14px", "type": "fontSizes" }, "body-small": { "value": "12px", "type": "fontSizes" } }, "style": { "h1": { "bold": { "value": { "fontFamily": "$font-family", "fontWeight": "$font.weight.bold", "lineHeight": "$line-height.h1", "fontSize": "$font.size.h1", "letterSpacing": "0%", "paragraphSpacing": "0", "textDecoration": "none", "textCase": "none" }, "type": "typography" }, "semibold": { "value": { "fontFamily": "$font-family", "fontWeight": "$font.weight.semibold", "lineHeight": "$line-height.h1", "fontSize": "$font.size.h1", "letterSpacing": "0%", "paragraphSpacing": "0", "textDecoration": "none", "textCase": "none" }, "type": "typography" }, "medium": { "value": { "fontFamily": "$font-family", "fontWeight": "$font.weight.medium", "lineHeight": "$line-height.h1", "fontSize": "$font.size.h1", "letterSpacing": "0%", "paragraphSpacing": "0", "textDecoration": "none", "textCase": "none" }, "type": "typography" } }, "h2": { "bold": { "value": { "fontFamily": "$font-family", "fontWeight": "$font.weight.bold", "lineHeight": "$line-height.h2", "fontSize": "$font.size.h2", "letterSpacing": "0%", "paragraphSpacing": "0", "textDecoration": "none", "textCase": "none" }, "type": "typography" }, "semibold": { "value": { "fontFamily": "$font-family", "fontWeight": "$font.weight.semibold", "lineHeight": "$line-height.h2", "fontSize": "$font.size.h2", "letterSpacing": "0%", "paragraphSpacing": "0", "textDecoration": "none", "textCase": "none" }, "type": "typography" }, "medium": { "value": { "fontFamily": "$font-family", "fontWeight": "$font.weight.medium", "lineHeight": "$line-height.h2", "fontSize": "$font.size.h2", "letterSpacing": "0%", "paragraphSpacing": "0", "textDecoration": "none", "textCase": "none" }, "type": "typography" } }, "h3": { "bold": { "value": { "fontFamily": "$font-family", "fontWeight": "$font.weight.bold", "lineHeight": "$line-height.h3", "fontSize": "$font.size.h3", "letterSpacing": "0%", "paragraphSpacing": "0", "textDecoration": "none", "textCase": "none" }, "type": "typography" }, "semibold": { "value": { "fontFamily": "$font-family", "fontWeight": "$font.weight.semibold", "lineHeight": "$line-height.h3", "fontSize": "$font.size.h3", "letterSpacing": "0%", "paragraphSpacing": "0", "textDecoration": "none", "textCase": "none" }, "type": "typography" }, "medium": { "value": { "fontFamily": "$font-family", "fontWeight": "$font.weight.medium", "lineHeight": "$line-height.h3", "fontSize": "$font.size.h3", "letterSpacing": "0%", "paragraphSpacing": "0", "textDecoration": "none", "textCase": "none" }, "type": "typography" } }, "h4": { "bold": { "value": { "fontFamily": "$font-family", "fontWeight": "$font.weight.bold", "lineHeight": "$line-height.h4", "fontSize": "$font.size.h4", "letterSpacing": "0%", "paragraphSpacing": "0", "textDecoration": "none", "textCase": "none" }, "type": "typography" }, "semibold": { "value": { "fontFamily": "$font-family", "fontWeight": "$font.weight.semibold", "lineHeight": "$line-height.h4", "fontSize": "$font.size.h4", "letterSpacing": "0%", "paragraphSpacing": "0", "textDecoration": "none", "textCase": "none" }, "type": "typography" }, "medium": { "value": { "fontFamily": "$font-family", "fontWeight": "$font.weight.medium", "lineHeight": "$line-height.h4", "fontSize": "$font.size.h4", "letterSpacing": "0%", "paragraphSpacing": "0", "textDecoration": "none", "textCase": "none" }, "type": "typography" } }, "body": { "bold": { "value": { "fontFamily": "$font-family", "fontWeight": "$font.weight.bold", "lineHeight": "$line-height.body", "fontSize": "$font.size.body", "letterSpacing": "0%", "paragraphSpacing": "0", "textDecoration": "none", "textCase": "none" }, "type": "typography" }, "semibold": { "value": { "fontFamily": "$font-family", "fontWeight": "$font.weight.semibold", "lineHeight": "$line-height.body", "fontSize": "$font.size.body", "letterSpacing": "0%", "paragraphSpacing": "0", "textDecoration": "none", "textCase": "none" }, "type": "typography" }, "medium": { "value": { "fontFamily": "$font-family", "fontWeight": "$font.weight.medium", "lineHeight": "$line-height.body", "fontSize": "$font.size.body", "letterSpacing": "0%", "paragraphSpacing": "0", "textDecoration": "none", "textCase": "none" }, "type": "typography" } }, "body-small": { "bold": { "value": { "fontFamily": "$font-family", "fontWeight": "$font.weight.bold", "lineHeight": "$line-height.body-small", "fontSize": "$font.size.body-small", "letterSpacing": "0%", "paragraphSpacing": "0", "textDecoration": "none", "textCase": "none" }, "type": "typography" }, "semibold": { "value": { "fontFamily": "$font-family", "fontWeight": "$font.weight.semibold", "lineHeight": "$line-height.body-small", "fontSize": "$font.size.body-small", "letterSpacing": "0%", "paragraphSpacing": "0", "textDecoration": "none", "textCase": "none" }, "type": "typography" }, "medium": { "value": { "fontFamily": "$font-family", "fontWeight": "$font.weight.medium", "lineHeight": "$line-height.body-small", "fontSize": "$font.size.body-small", "letterSpacing": "0%", "paragraphSpacing": "0", "textDecoration": "none", "textCase": "none" }, "type": "typography" } } } }, "link": { "font": { "style": { "midsize": { "value": { "fontFamily": "$font-family", "fontWeight": "$font.weight.semibold", "lineHeight": "$line-height.body", "fontSize": "$font.size.body", "letterSpacing": "0%", "paragraphSpacing": "0", "textDecoration": "none", "textCase": "none" }, "type": "typography" }, "tiny": { "value": { "fontFamily": "$font-family", "fontWeight": "$font.weight.semibold", "lineHeight": "$line-height.body-small", "fontSize": "$font.size.body-small", "letterSpacing": "0%", "paragraphSpacing": "0", "textDecoration": "none", "textCase": "none" }, "type": "typography" } } } }, "line-height": { "h1": { "value": "40", "type": "lineHeights" }, "h2": { "value": "32px", "type": "lineHeights" }, "h3": { "value": "28px", "type": "lineHeights" }, "h4": { "value": "24px", "type": "lineHeights" }, "body": { "value": "20px", "type": "lineHeights" }, "body-small": { "value": "16px", "type": "lineHeights" } }, "shadow": { "white": { "tiny": { "value": { "x": "0", "y": "1px", "blur": "5px", "spread": "0", "color": "rgba(118, 148, 188, 0.12)", "type": "dropShadow" }, "type": "boxShadow" }, "midsize": { "value": { "x": "0", "y": "10px", "blur": "40px", "spread": "-5px", "color": "rgba(0, 64, 184, 0.16)", "type": "dropShadow" }, "type": "boxShadow" }, "big": { "down": { "value": { "x": "0", "y": "33px", "blur": "64px", "spread": "-19px", "color": "rgba(0, 64, 184, 0.08)", "type": "dropShadow" }, "type": "boxShadow" }, "up": { "value": { "x": "0", "y": "-33px", "blur": "64px", "spread": "-19px", "color": "rgba(0, 64, 184, 0.08)", "type": "dropShadow" }, "type": "boxShadow" } } }, "blue": { "midsize": { "value": { "x": "0", "y": "8px", "blur": "26px", "spread": "-4px", "color": "rgba(21, 98, 240, 0.2)", "type": "dropShadow" }, "type": "boxShadow" } }, "dark": { "tiny": { "value": { "x": "0", "y": "12px", "blur": "24px", "spread": "-7px", "color": "rgba(3, 61, 163, 0.24)", "type": "dropShadow" }, "type": "boxShadow" }, "midsize": { "value": { "x": "0", "y": "22px", "blur": "64px", "spread": "-12px", "color": "rgba(3, 61, 163, 0.16)", "type": "dropShadow" }, "type": "boxShadow" }, "big": { "value": { "x": "0", "y": "34px", "blur": "64px", "spread": "-16px", "color": "rgba(3, 61, 163, 0.16)", "type": "dropShadow" }, "type": "boxShadow" } } }, "space": { "s": { "zero": { "value": "0", "type": "spacing" }, "half": { "value": "2", "type": "spacing" }, "1x": { "value": "4", "type": "spacing" }, "1x-half": { "value": "6", "type": "spacing" }, "2x": { "value": "8", "type": "spacing" }, "3x": { "value": "12", "type": "spacing" }, "4x": { "value": "16", "type": "spacing" }, "5x": { "value": "20", "type": "spacing" }, "6x": { "value": "24", "type": "spacing" }, "8x": { "value": "32", "type": "spacing" } }, "m": { "1x": { "value": "4", "type": "spacing" }, "2x": { "value": "8", "type": "spacing" }, "3x": { "value": "12", "type": "spacing" }, "4x": { "value": "16", "type": "spacing" }, "6x": { "value": "24", "type": "spacing" }, "8x": { "value": "32", "type": "spacing" }, "10x": { "value": "40", "type": "spacing" }, "12x": { "value": "48", "type": "spacing" }, "16x": { "value": "64", "type": "spacing" }, "20x": { "value": "80", "type": "spacing" }, "24x": { "value": "96", "type": "spacing" }, "32x": { "value": "128", "type": "spacing" }, "40x": { "value": "160", "type": "spacing" } }, "inset": { "normal": { "half": { "value": "{space.s.half} {space.s.half} {space.s.half} {space.s.half}", "type": "spacing" }, "1x": { "value": "{space.s.1x} {space.s.1x} {space.s.1x} {space.s.1x} ", "type": "spacing" }, "1x-half": { "value": "{space.s.1x-half} {space.s.1x-half} {space.s.1x-half} {space.s.1x-half} ", "type": "spacing" }, "2x": { "value": "{space.s.2x} {space.s.2x} {space.s.2x} {space.s.2x} ", "type": "spacing" }, "3x": { "value": "{space.s.3x} {space.s.3x} {space.s.3x} {space.s.3x} ", "type": "spacing" }, "4x": { "value": "{space.s.4x} {space.s.4x} {space.s.4x} {space.s.4x} ", "type": "spacing" }, "5x": { "value": "{space.s.5x} {space.s.5x} {space.s.5x} {space.s.5x} ", "type": "spacing" } }, "squashed": { "zero-1x": { "value": "{space.s.zero} {space.s.1x} {space.s.zero} {space.s.1x} ", "type": "spacing" }, "4x-5x-4x-4x": { "value": "{space.s.4x} {space.s.5x} {space.s.4x} {space.s.4x} ", "type": "spacing" }, "2x-3x": { "value": "{space.s.2x} {space.s.3x} {space.s.2x} {space.s.3x} ", "type": "spacing" }, "2x-4x": { "value": "{space.s.2x} {space.s.4x} {space.s.2x} {space.s.4x} ", "type": "spacing" }, "2x-3x-2x-2x": { "value": "{space.s.2x} {space.s.3x} {space.s.2x} {space.s.2x} ", "type": "spacing" }, "3x-6x": { "value": "{space.s.3x} {space.s.6x} {space.s.3x} {space.s.6x} ", "type": "spacing" }, "4x-6x": { "value": "{space.s.4x} {space.s.6x} {space.s.4x} {space.s.6x} ", "type": "spacing" } } } }, "size": { "xxs": { "value": "16", "type": "sizing" }, "xs": { "value": "20", "type": "sizing" }, "s": { "value": "24", "type": "sizing" }, "m": { "value": "32", "type": "sizing" }, "l": { "value": "40", "type": "sizing" }, "xl": { "value": "64", "type": "sizing" }, "xxl": { "value": "80", "type": "sizing" } }, "border": { "thin": { "value": "1", "type": "borderWidth" }, "bold": { "value": "6", "type": "borderWidth" } }, "color": { "background": { "page": { "value": "#ffffff", "type": "color", "faded": { "value": "#F5F9FE", "type": "color" } }, "base": { "value": "#ffffff", "type": "color" }, "elevated-2": { "value": "#3A5075", "type": "color", "highlighted": { "value": "#48618A", "type": "color" } }, "elevated": { "highlighted": { "value": "#263B5E", "type": "color" } }, "neutral": { "value": "#E7F0FD", "type": "color", "highlighted": { "value": "#CEDCF3", "type": "color" }, "faded": { "value": "#F5F9FE", "type": "color" } }, "disabled": { "value": "#EFF3F8", "type": "color" }, "primary": { "value": "#2066E4", "type": "color", "highlighted": { "value": "#1855C4", "type": "color" }, "faded": { "value": "#EAF1FD", "type": "color" } }, "positive": { "value": "#2066E4", "type": "color", "highlighted": { "value": "#EAF1FD", "type": "color" } }, "critical": { "value": "#E13755", "type": "color", "highlighted": { "value": "#FFEDF0", "type": "color" } } }, "on-background": { "neutral": { "value": "#03122B", "type": "color", "highlighted": { "value": "#03122B", "type": "color" } }, "primary": { "value": "#ffffff", "type": "color", "highlighted": { "value": "#ffffff", "type": "color" } }, "positive": { "value": "#ffffff", "type": "color", "highlighted": { "value": "#ffffff", "type": "color" } }, "critical": { "value": "#ffffff", "type": "color", "highlighted": { "value": "#ffffff", "type": "color" } }, "elavated": { "value": "#ffffff", "type": "color", "highlighted": { "value": "#ffffff", "type": "color" }, "faded": { "value": "#3C455D", "type": "color" } } }, "foreground": { "neutral": { "value": "#03122B", "type": "color", "faded": { "value": "#263B5E", "type": "color" } }, "neutral-light": { "value": "#5976A6", "type": "color", "faded": { "value": "#6E8BB9", "type": "color" } }, "disabled": { "value": "#ADB5C5", "type": "color" }, "primary": { "value": "#2066E4", "type": "color" }, "positive": { "value": "#2066E4", "type": "color" }, "critical": { "value": "#E13755", "type": "color" }, "white": { "value": "#ffffff", "type": "color" } }, "border": { "neutral": { "faded": { "value": "#F5F9FE", "type": "color" }, "highlighted": { "value": "#CEDCF3", "type": "color" } }, "tooth": { "enabled": { "value": "#A7BBDF", "type": "color" }, "highlighted": { "value": "#3763B6", "type": "color" }, "active": { "value": "#0741AE", "type": "color" } }, "primary": { "value": "#2066E4", "type": "color" }, "positive": { "value": "#2066E4", "type": "color" }, "critical": { "value": "#E13755", "type": "color" }, "white": { "value": "#ffffff", "type": "color" } }, "black": { "value": "#03122B", "type": "color" }, "white": { "value": "#ffffff", "type": "color" } } }

[six7]

Are you using GitHub sync? If so, are you possibly on a different branch than your colleagues or using a different filePath? The tokens itself look fine to me 🤔

[mmailaender]

It seems the problem was that I've added as Branch "Main" but it was "main". Seems that it's case sensitive. Now it's working, thank you.