Reuse components lost their design tokens in the design spec

Community Beginner ,
Aug 15, 2022 Aug 15, 2022

Copy link to clipboard

Copied

I added design tokens in Adobe XD by naming the colors and character styles presented in the assets panel, then applied the design tokens in the main component. I can view the design tokens in the current XD file specs link.

But when IIdragged the component from the components library onto a new XD file to share that component across documents, I noticed that all the design tokens were missing in design specs.

It's so inconvenient that developers only can view the design tokens in the original design specs.




TOPICS
Design , Known Issue , Missing feature

Views

198

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Aug 15, 2022 Aug 15, 2022

Copy link to clipboard

Copied

Reuse components lost their design tokens in the design spec.

I added design tokens in Adobe XD by naming the colors and character styles presented in the assets panel, then applied the design tokens in the main component. I can view the design tokens in the current XD file specs link.

But when I dragged the component from the components library onto a new XD file to share that component across documents, I noticed that all the design tokens were missing in the design specs.

It's so inconvenient that developers only can view the design tokens in the original design specs.

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Adobe Employee ,
Aug 20, 2022 Aug 20, 2022

Copy link to clipboard

Copied

Hi 璇23831066u64y, 

 

Sorry for the trouble. I have tried to replicate it; however, it is working fine on my end. 

 

Here is what I did. 

 

  • Assigned a token to color and character style.
  • Published the library. 
  • Created a new file. 
  • Created a component and applied the color. 
  • Published the Design specs, and I can see the design token both in property inspector and CSS. 

 

If this is not what you're doing, please share the steps to reproduce it so I can investigate it. 

 

Please ensure that you update Adobe XD to the latest build, XD 54, and let us know if that help. 

 

Thanks,

Atul_Saini

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Aug 23, 2022 Aug 23, 2022

Copy link to clipboard

Copied

Hello Atul_Saini, thanks for your reply.

Here are my steps.

  • Named a token, and assigned it to color and character style.
    (For example: Typography token Name: Title 20 gray9, Font size: 20px, Color: 1A202c Gray9)
  • Created a component and applied the typography token
  • Published the library. 
  • Published the current file's Design specs, I can see the design token in property inspector.
    (Please see attached: original design specs.png)
  • Created a new file
  • Dragged the component from the components library onto the artboard.
  • Published the new file's Design specs, and I noticed that all the typography tokens were missing.
    (Please see attached: design tokens missing.png)

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Aug 23, 2022 Aug 23, 2022

Copy link to clipboard

Copied

I already confirmed my Adobe XD is the latest build XD 54.0.12.

It's inconvenient that developers only can view the design tokens in the original design specs. When I created a new file to reuse components from the library, I needed to apply the color and character style all over again.
Designers often collaborate to maintain a large website, follow the same design guideline, and share design assets with libraries. If there's a website with dozens of design files and hundreds of different components, I need to apply the design tokens thousands of times. Just so that engineers can see the names of the color and typography in Design specs. 

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Sep 15, 2022 Sep 15, 2022

Copy link to clipboard

Copied

LATEST

Can somebody help me with these problems?

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines

Save time with Adobe Express quick actions