A way to export/import styles (text + colors)

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.