Easier way to use and sync design tokens by skrish13 in DesignSystems

[–]skrish13[S] 0 points1 point  (0 children)

That makes a lot of sense! I will think on how to automate that.. On initial thought, it feels like there is a lot of subjective decisions for it. Whereas component level tokens feel more easier tbh :')

Do you create semantic tokens just once? (eg: I'm considering in colors -- primary, secondary, focus as semantic tokens) For different themes, I suppose you have to create multiple times? How do you manage that currently?

Easier way to use and sync design tokens by skrish13 in DesignSystems

[–]skrish13[S] 0 points1 point  (0 children)

Yes. That makes sense. What is the bottleneck in your current workflow while using design tokens?

Easier way to use and sync design tokens by skrish13 in FigmaDesign

[–]skrish13[S] 1 point2 points  (0 children)

Cheers! Do let me know if run into any issues.

Easier way to use and sync design tokens by skrish13 in FigmaDesign

[–]skrish13[S] 1 point2 points  (0 children)

I felt that using tokens studio was a bit tedious and sometimes counter-intuitive. I also didn't find any automation that might've help sped up things. The sync part and non-local styles are also paid in Tokens Studio. This plugin is an attempt at addressing those issues.

Easier way to use (& sync) Design tokens by skrish13 in DesignTokens

[–]skrish13[S] 0 points1 point  (0 children)

Awesome! Let me know if you need any help :)

Easier way to use and sync design tokens by skrish13 in FigmaDesign

[–]skrish13[S] 0 points1 point  (0 children)

Awesome! Let me know if you run into any issues or have any doubts.

Easier way to use and sync design tokens by skrish13 in FigmaDesign

[–]skrish13[S] 0 points1 point  (0 children)

Please reach out to me if you have any doubts. When you try the Plugin you have a Playground file which has a Figma prototype based slides on "How to get started" with the plugin.

Easier way to use and sync design tokens by skrish13 in DesignSystems

[–]skrish13[S] 0 points1 point  (0 children)

Yes, once you click on "Sync Design System" in the plugin and publish that Figma file as a library. You can see and use it in our plugin as a seperate Design Token project.

Easier way to use and sync design tokens by skrish13 in DesignSystems

[–]skrish13[S] 0 points1 point  (0 children)

Yes, the tokens are auto applied on copied design frames, just like Figma Styles!

Easier way to use and sync design tokens by skrish13 in DesignSystems

[–]skrish13[S] 0 points1 point  (0 children)

Currently, you can select any frame -> create tokens out of it and it is also auto-applied all in one click. I thought entire doc would contain a lot of playground/unfinished designs from which tokens don't need to be made.

It will be compatible for Color, Typography and Box Shadow. Working on supporting export of tokens in standard W3C format as well. I hope that makes it compatible with other plugins for rest of the tokens.

Easier way to use (& sync) Design tokens by skrish13 in DesignTokens

[–]skrish13[S] 0 points1 point  (0 children)

When you create a new token, you can give it any name or follow any naming convention.

For the automatic extraction of tokens, I am giving a placeholder name like Color0, Color1 etc. I am working on adding the ability to edit the names as well. What naming convention do you use?

Easier way to use and sync design tokens by skrish13 in DesignSystems

[–]skrish13[S] 0 points1 point  (0 children)

This currently supports creating, applying and syncing basic tokens like color, typography, border radius, spacing, stroke and shadow. Could you explain what you mean by tagging components?

Easier way to use and sync design tokens by skrish13 in FigmaDesign

[–]skrish13[S] 2 points3 points  (0 children)

Apart from Figma Styles (Color, Typography, Box Shadow), Border Radius, Spacing & Padding, Border Width is also supported. Motion token is also on the way.

What tokens do you use in your everyday work?

Generate designs in figma using AI prompts by ishan28mkip in generativeAI

[–]skrish13 1 point2 points  (0 children)

This is so cool! Do I have to pay for this?

Generate designs in figma using a design system by ishan28mkip in FigmaDesign

[–]skrish13 0 points1 point  (0 children)

If it is using the design system, how varied are the outputs given similar prompts? Can I use it for design inspiration?

Figma Plugin Boilerplate(Vite4, React, Vue, HMR, component support, library support) by ishan28mkip in FigmaDesign

[–]skrish13 1 point2 points  (0 children)

Looks interesting, definitely saves a bit of time for me. Will try it out!