Hi, same problem here. Could you please share the plugins that allow that? That would be awesome!

In addition, is it possible to share/subscribe to libraries across different organizations?

Did you try Styler?

You can use Extract Styles to get all the styles as layers, then copy / paste into the new project, then use Generate Styles to create styles from layers. There are some limitations with the text layers.

I’m looking for this same feature. Have one file where you can setup all you typography and text styles as a base. Then when starting new projects you can copy that page over keeping the styles and then you can adjust them. It’s different than using the team styles library.

Duplicate file?

Excellent point @Andrei_Iancu ! However, this is not always a solution and a fix for this issue, even thought would (perhaps) solve the issue in @Yianni_Mathioudakis 's situation, that he described above.

Not everyone has their design system set up as he describes. Some have styles + components all in one file. I do still think there is a need for this feature.

I believe that I understand. 🤔

So mainly you would like to have a base, then to make themes for that base?

A project similar to component and instances, but for the entire library. 🧐

Could you describe a flow for this feature? Asking because i cannot see the solution fully. 😅

@Andrei_Iancu I’m guessing ‘duplicate’ file would work if I started from that file. But let me clarify my current situation some more if this helps.

I’m working on multiple website design projects.

Project A - is designed, but now I’m ready to clean up the system, define the text styles, and apply them throughout.

Project B - is a style guide framework which is has pre-defined text styles.

I’d like to copy the Project B style guide frame into Project A, so all the text styles are defined and setup. These styles don’t match Project A, but now all I have to do is update the font/treatment, and now it’ll be ready to go with shared styles.

For me, I’m trying to save the time of having to re-set all the h1-h6 and body styles for each project and rather edit them instead.

Thanks for bringing up this topic. Not only would our team like the ability to export/import styles I think Figma should make it easier to export and import project files including components that stay attached. Last week Sho asked the Twitter community what do you wish Figma had and what do you wish it didn’t do. Here my post on this topic -https://twitter.com/Christian3D/status/1359528519601061889?s=20

We put a lot of work into building components and we include theming styles in our components to be able to support things like both light mode and dark mode. Of course, we want to be able to reuse as much of our hard work from project to project. If we do work in our customer’s Figma account, we can’t export the component library and or styles and import them into a new account without the connections to the styles and connection to components (i.e. reusing things like templates) breaking.

The same would be true for any designer who would like to back up their work into a personal figma account for portfolio purposes.

All the components and styles break even if you try to rebuild your backed up .fig files exactly like the original environment, including even setting up the same project names Everything results in extremely frustrating 404 errors. @Gleb made a super helpful plugin that helps reattach components but even this is still a per component experience that just is a total time waste. I am a HUGE fan of Figma but this one Figma problem is by far my least favorite thing about Figma and something that I have never seen with other design tools.

Is this what are you talking about?

I doesn’t see a way to link a layer without style to a style especially if the properties of the new style doesn’t match the properties of targeted layer. Maybe AI, someday… 😅

Here is something for the colors:

Match fills to local styles

Also there are some issues I discovered while I recorded the video above, and I’ll fix these in the next update of the Styler.

Is it possible to share the same component library but with different themes across different projects?

This is Awsome! This plugin perfectly solved my problem!

We are also running into this problem on a regular basis…

When designing an app, you often start with pages and components in a beautiful and messy process.

But when the design is complete, we want to be able to migrate all styles and components to a separate file, so that it can be reused for both existing designs, and future features/products that live under the same brand.

That makes total sense to me. We don’t want to be forced into just cramming everything into one giant file just to be able to reuse components 😕

The only option I see, if you want the style/component links to stay intact, is to create a component+style file from the very start of the project.

The issue with this method is that it’s clunky. It forces you to keep publishing and fetching every single tweak, while you are still in the early explorative phase…

Having an extra option in this menu called ‘Duplicate style in this file’ would do the job for me.

The problem with ‘Move style…’ is that it really moves rather than just duplicating it. Looks like I will have to be doing manually the duplication.

I tried using Styler but it duplicates only 10 styles and that’s it 😦

Hey,

What do you mean Styler duplicates only 10 styles? 🤔

Can you send me a recording of what it happens, please? 🙏

As long as the name is not the same, you should not have any issues with the plugin 🤔

If the layer names are the same, the plugin is trying to find a match between layer name and style name and update the existing ones.

I came up with a method that essentially duplicates styles in the way you might need using the plugins Automator and Styler.

1. After installing the Automator plugin, import the automation that is relevant to you (I made one for text, fill, and effect styles)


2. Create or copy relevant layers that have external styles set


3. Run the relevant automation to rename each layer to the related style per item


4. Select layers and run Generate Styles using the Styler plugin


5. Selected styles are now available in your local file vs. the original style definition

I’ve submitted my automation JSON files to the Automator community site. If they aren’t available soon, I can send them via DM here.

Tagging @Andrei_Iancu for awesome work with the Styler plugin! This plugin is what makes the “duplicate” method above work!

I can’t believe that there’s nothing that has been natively implemented yet, something that would allow us to export styles as JSON files and import as well would be very welcoming!

I agree that is a major pain.

We started our Design System into a single file.

As we now have massive components leveraging 100s of variants, that single file is massive and on the verge of running out of memory.

So we decided to extract all the Components into individual project file onto another Secret Team Account. This is to prevent we don’t end-up with duplicates for the various team members as this migration will take days/weeks to complete.

But all Styles (Fonts & Colors) are still linked to our original file.

‘Duplicating’ (and relinking them) instead of ‘Moving’ would make so much more sense.

Our buttons color styles are still linked to the old file, in another team account.

+1 for Moving feature.

Our Design System is also in a single document. Styles, foundations, everything. We need to extract the color/type/logo/foundation to give it a rebranding flexibility.

I would love to have the feature to move styles to another file while maintaining the connection to components.

+1 for Moving feature

Same issues as above:

Project A I have one working doccument which contains multiple pages for sitemap, wireframes, flat design respectively. Finalised colours and text styles are set locally in the latter page.



Project B is a ‘re-skin’ for a second site for the same client. I essentially want to create a working document with a new page for flat design, then copy the various frames from Project A > flat design and update the colour palette and typography to fit the second brand, whilst retaining the same layout and component structure.

Setting colour and text styles at a document level should then be copyable to a new project > document, or importable per swatches and character / paragraph styles in Creative Suite.

Using centralised Libraries necessitates accepting updates any time there is a slight change and doesn’t afford the option to override / customise in a new file.

Design System Organizer plugin allows to import/export styles, relink components, etc.

Does your automation rename the layers based on the styles that are applied to them? That’s what I’ve been looking for to help create local styles from a shared library of styles that I need to experiment with for a different project. Would love a link to that automation if you can share.

I see a lot of complex use cases for this problem, however I am simply trying to add the list of text styles to an existing project that was done with the wrong typography. Ideally I should be able to select each incorrect H1, H2, H3 etc… and in the character panel choose the correct text style we’ve created and apply it to the selection. I would allow of use apply the same typography across all of our various designs and landing page files very easily, without having to change every single text box individually, every time. Similar to adobe libraries having a shared library of character and paragraph styles. Is this not possible? I keep looking for this feature and only finding these more complex discussion that seem to go in circles anyway.

Styler is awesome, thank you for your recommendation. But unfortunately Styler only exports the text title, not with the text properties ( Line Height, Letter spacing, etc.). Is there any plugin or tips to export text style along with the properties?. Any help would be really appreciated.

👋 Hey @Rian_cintiyo,

I’m a bit confused, why are you saying that line height and letter spacing are not generated/extracted by the Styler plugin: I don’t get the same behavior.

It is true that Styler can’t get the advanced text properties found in “Type settings” panel because these properties are not available through Figma plugin API – no plugin should be able to create a text style that have these properties.