Allow duplicate character styles and colors (CSS)
Currently you can only have one character style for a given set of parameters, however it might be nice to have duplicate character styles. For example h3 in tablet might match up with h4 on desktop, but it's confusing for them to share a single style.
Maarten Meekers commented
In most adobe programs you can duplicate styles with the same properties and give them a different name. In adobe xd you can't.
However in adobe xd you can animate buttons because that really makes life easier when you are working on the base of a project.
Yeah, so you have two character styles. One for the black font version and one for the white font version. Now, if the client want's the Dark UI, I can't just switch the two colors. If I change the one to the white font version, then XD merges all the character styles and I've only got 1 style now, because styles are not independant of font/color settings. I have to use a grey or another color intermediately and adjust these three times.
Please let us have named colors styles that can be setup however we like.
Dan Vaughan commented
You guys are insane. A hundred thousand ways to ruin my workflow. Why did you do this?
Jake Young commented
In internal meetings/ client calls – everytime such a basic feature is not available, it makes us designers look bad. I need to work at multiple breakpoints and text styles overlap all the time. For example my H1 on desktop may be the same size as my H2 or H3 on smaller devices. Please Adobe, sort this out.
It’s insane that this is still not implemented. I tried a workaround someone mentioned in the comments, setting a different style, saving, and then editing in the style in the assets panel to match what I need...and it removed the existing matching style so all I was left with was the new one with the new name.
Paul Bunyar commented
I believe it would be helpful for designers and developers if there was a way to name and separately identify the characters styles as listed in the asset panel. For example, my H1 is Proxima Nova Extra Condensed Bold 42 pt. I only have name available to me. I want to name it H1 but have it's identity — Proxima Nova Extra Condensed Bold 42 pt. — still remain on the list view. The font identity would change if I change the actual font. But the H1 would remain because it will remain the H1 for my web page. As it is now, I can either leave the font identity as the name or change the name to H1. And it doesn't actually include the font as being Bold.
I.D.: Typeface name, font, size
Color: As shown now
May not help perfectionists but found a work around for this.
By adjusting the letter spacing to -0.01 ( I tried smaller but Xd has limits) allows me to create a separate style.
Not ideal but i would rather have independent control of my styles
how is this still not a functionality...
There is a workaround, it's not straightforward but works:
1. Create a "dummy" text element with the style that is not yet saved in the character styles.
2. Save it to character styles.
3. Edit saved style to match your needs.
This way you can recreate duplicates and also name them later according to your design system needs :-)
Nándor János Danyi commented
I'd like to be able to have multiple istances of the same color.
Changing a color to an already existing one in the asset panel, merges the two colors. If I have 100 components with color A and 100 with color B and decide to have all 200 components with color A, the easiest way to achieve this is by changing color B to A. The two colors merge, and if later I need to change the color of the original B colored 100 components, then I'm in a terrible position...
Michael Herr commented
@Clemens Gramespacher probably no votes because folks need to work. Most people have probably realized after researching that this is not something that Adobe has scoped out as a feature that is needed and moved on to another application like Figma that does this just fine.
In this day and age, there is competition and quite often, the competition is far better than what is considered industry standard.
In my opinion, Adobe should pay a little bit more attention to why users are finding and using other software.
Please consider implementing this. It's a huge pain for us at the moment. I would love to be able to define colour assets by function (background, dark background, button, dark button, header, dark header, etc.) but in some cases I use the same colour for different functions. It's not possible to achieve this with the current implementation.
It's also a problem for defining light/dark mode colours. I could define a colour (Blue) and a dark mode equivalent (Blue Dark), but it's not always the case that everything that uses blue in light mode will use the equivalent dark blue in dark mode. Different elements may need a different treatment, and it becomes messy to keep track of this and communicate to developers.
When I selected text boxes and apply a character style, some of the other text boxes also get that style applied when I don't want them to as I have a different text alignment on them and want to create a different character style for those. Although XD does this I can still select those specific text boxes and should be able to create a different style but I can't. Please add this feature.
Nuts, this does not work.
I would like to have the same color for icons and headlines but might want to change that later on without having to manually re-assign the new color to each icon.
This really is quite basic... :-/
Why does a design software behave like it's more clever than the designer??
If I decide how H1 should look on all mobile screens, why does it delete this character style if I make another style for desktop (with the same parameters) ? This is not a friendly solution.
Running into the same issue with repeat character styles applied to different viewports. Need to assign specific variables to each character style without having to cross-reference. Huge limitation for responsive design. What are some temporary work-arounds for this while (hopefully) Adobe addresses?
Yorik WNENT commented
It is a major issue if we want to build Design System with XD.
Just with that i am thinking to change software...
PLZ Adobe !
Running into this same problem in character styles for responsive web design.
Yes, I am doing that work around right now, but they are not stored in "Character styles". I am requesting a feature to create sets under character styles not assets/symbols that DO NOT overwrite styles with the same values. e.g. I have a font that on mobile and desktop are equal but on two different breakpoints, but they overwrite eachother.
Since Adobe XD does not support EM or REM values, we need to do sets of different fontsizes for developer handover and a collaborative UI Kit, where fontsizes for different breakpoints are fixed.
It is fairly simple actually.