How does a Design System structure looks like with multiple platforms (iOS, Android, Web, etc.)?

Hello world,

I’m setting up a design system in Figma for which I have a library named “core”. Here are all the components which are equal for web, iOS and Android.

Coming from Sketch I did the same.
In addition, I had for Web, iOS and Android a separate file which had components only for their specific usage. So that designers use only components which they are allowed to (for example iOS only).

In Figma, it seems like that everything is inside one file … is that right?
I tried to separate them, but even if I’m not switching on the core library, I still can see and use components in their …

Is there a good explain tutorial or structure for this?

I really appreciate your advices and help :pray:

Thanks in advance :open_hands:

You could have the core library, and then a separate library file for iOS and another for Android, etc. It would result in two library files that need to be applied to future files, but that separates the components that are exclusive to certain platforms.

Thanks, Phil, for the advice. I actually did the same, good to hear it’s a way.
The only problem I have with this solution is that I still see ALL elements also from core, even I haven’t activated this library in a different project … As soon as I activate the Web Library I will see also iOS elements if I search for them inside the assets panel … Am I doing something wrong in the library activation?

In the assets panel you can also see assets from all libraries, that might be what you’re experiencing

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.