Override styles in a symbol (allow symbol differences)
Right now, you can override text and bitmaps in a symbol. I'd like to be able to override appearance properties like opacity, fill color, borders, shadows, and font style.
AdminElaine (Adobe)
(Product Manager, Adobe)
shared this idea
Hi All,
We’re excited to announce that with our May release, we have introduced Components (previously known as symbols). Components are design elements with unmatched flexibility that help you create and maintain repeated elements while varying the instances for different contexts and layouts.
You can create a master component to define a reusable element, such as a button, and you can change any of its properties to customize instances of that element (Size & Layout, Style and Appearance, and Structural overrides). Changes you make to an individual instance are specific to that element, but changes you make to the master propagates to all the instances where the property hasn’t been customized.
Components now could also be responsively resized with the same powerful capabilities of responsive resize baked in.
Finally, you could link components across documents to maintain a single source of your components using the Link Assets feature or simply through copy/pasting components across documents.
To learn more, please check:
https://letsxd.com/whats-new
https://helpx.adobe.com/xd/help/linked-components.html
Please give it a try and let us know what you think.
Thank You!
-
Jessica Johnston
commented
This is a great update. However, it would be great to be able to add new layers into a pre-existing master component
-
Arthur Shen
commented
It does not have opacity though?
-
Zach Bruce
commented
This is possible with the latest update! :)
-
Larry
commented
This is a must have feature and in my opinion, one of the most important ones.
-
Anonymous
commented
I was so excited about XD, man this is such a letdown. When you ungroup to override, it creates another symbol. This is top most important feature for any UI designer.
-
Al
commented
Agree. Greatly needed!
-
Oleg
commented
It's totally necessary to be ablse to override width/height of a symbol instance.
-
Nicola
commented
I'm not sure why this is hasn't been review yet. But it is an essential part to have the override panel!
-
Clint
commented
Yes... this feature is absolutely necessary. After several years in Sketch, this is the one essential missing feature I need to make the move.
-
Turnwall
commented
+1 for looking into how Sketch and Figma allow overrides of symbols, specifically overriding text.
Two additional ideas / requests:
(1) It would also be really amazing to also override simple dimensions:
Use case: if you have dynamic-width buttons (which XD allows for with the new "Responsive Resize" features), it would be nice to create a symbol that allows you to set the colors / fill / stroke / inner text and icon placement for button styles—but in each instance, allow you to change the text and then resize the button to fit just to the size that the text "fills".
(2) Then, be able to push "style" and "text" updates/overrides separately:
If we want to use the dynamic sizing specified above, then we need to push style updates to all symbol instances, without alos overriding the custom text and dimension styling we've done.Different versions of this are available in both Sketch and Figma with text overrides. Dimension overrides would be a big win for XD.
-
Tomasz Świtała
commented
+1. Please take inspiration from Sketch with symbol overrides / management.
-
JGP
commented
This is one of the most productive features of Figma, and now I'm back on XD it is strikingly absent.
The lack of this is killing my productivity.
-
Anonymous
commented
I just gave XD a first try and within 15 minutes ran into this issue. Seems like quite an basic yet essential feature to prevent having a million slightly different symbols.
-
Gabriel Mittleman
commented
Gave XD a second try now that my Principle license needed updating, and Sketch is becoming increasingly bloated. Very impressed with the work that has been done so far, but this needs to be fixed before i can make the switch. Creating repeat grids with symbols that I could individually override would be amazing.
-
Alex Restuccia
commented
+1
-
Anonymous
commented
Honestly you can't do this in XD? Wow!
-
David Behar commented
This is the only thing left to win the battle to Sketch, Please release something
-
Darcy Bross
commented
Overriding dimensions too would be amazing... Or choosing which things may be overridden. For an example, form inputs of different lengths.
-
Maureen
commented
Echoing Vlad. Sketch enables versatile and powerful overrides. The symbols concept isn't worthwhile if you need to create multiple versions of the same symbol to have version of size, color, etc.
-
Vlad Malik
commented
It would be nice to override any aspect of a symbol and then see the list of overrides and cancel them if needed (e.g., undo symbol mask position override).