You can search for community files like Figma’s “Simple Design System”, open it up in your account, and then explore it to see how they set up their variables, components, etc. https://www.figma.com/community/file/1380235722331273046/simple-design-system

You can also search for UI/Design kits from Apple, Google, and others to see how they set things up.

Just to confirm — there isn’t a way to access all the variables, collections, modes, tokens, etc., in one single view for any of the UI kits, right?

It seems like the only way to understand how things are set up is by going into individual components, instances, or elements and then clicking through typography, color styles, measurements, and modes. But even then, we’re mostly assuming the structure — without really knowing if they’ve used any primitive collections for aliasing different elements like typography or color, what kind of naming conventions they’ve followed from primitive to semantic or functional, and the specific syntax they’ve applied. Is that right?

Thank you! ​@Nate_G 

So basically, Figma’s “Simple Design System” file is set up in a way that when you open it and check the variables panel, it doesn’t show any variables.

But when I looked at the Apple UI Kit for iOS 18, the variables are set up right from the start. If a file has variables, they’ll be visible to anyone who has access to the file — which makes it much easier to see and work with them upfront.

If you “Make a copy of this file” of the “Simple Design System” you can view the variables.

Variables they are using.

This is so embarrassing — I checked the same file today, and I finally found it, thanks!