The Assets panel can be viewed by grid view or by list view. When seen as list, colors, character styles, and symbols can be renamed, and reordered by dragging an element or elements up or down within the panel. Label and organize elements, or drag symbols to the canvas to use them.
- With your assets panel open, you can select elements here and extract their colors, their character styles. And here I'm in grid view, but it can go to list view to see it as a list. Still here on grid view, got a preview of your text. If I want, for example, let's say I type Adobe XD as something there. And I wanna apply this guy, I can have my text selected, then I wanna apply this color and this formatting to this text, I just click there and then I guide it there.
It's right here. And if I want to save the big one, I can add that. So now I have the big one here, and I can go from there. If I wanna make changes to this, or to elements that followed that color or character style, let's say I wanna play with this green gradient, I can right click and say edit. And then if I play with this, you see that everywhere on my canvas that will update. This is pretty cool, this is pretty useful. Same for symbols. I can select the guy here, create a symbol, they show up here.
They show up on my list view as well. But at one point, I might decide to start organizing this. So I can go to the list view, for example, and say hey, I wanna have this guy up here. And be careful when you click on something. If I just click here, it will apply that to my selection. So I'll deselect that so it's not there. And if I click here now, I can right click and do things with no problems. Let's see, I have a rectangle here. I wanna apply this guy there, I click. Get there.
If I right click here, I can apply that as a border. We all saw that before. If I wanna start managing as we decide, I can move this guy up, I can then move this other one up. And now let's say I wanna move this whole group down a little bit. I can click here, hold shift, click up there, and then drag it down. The same way if I wanna delete something, I can right click and choose to delete and go from there. The next step would be naming this. So you should double click, if you're under your list view, and you should double click here, let's say this would be my black.
Or if you follow some design system convention, you could say con.adobe.black. So this is the Adobe Black, just as an example. And maybe my text, this would be an h1. This would be my h2. And then if I go on the grid view, as I hover those elements, I get a preview of the label as well. And then I can search here as well, so I can search for h1, I can search for a specific color or symbol.
The name of this symbol is 54, so if I type 54 or just 4, I get there. But let's rename that symbol to be more realistic. So double click here and I'll call this welcome card. And it's all there. So this is how you can organize your elements on the assets panel. You can move them around, you can delete them, you can apply the changes to selections here, or can add in something here, even modify your document as a whole.
You can go to the grid view, list view, and you can search by colors, character styles, symbols, or by name as you type.
- Understanding all tools in Design mode
- Bringing files for Photoshop, Illustrator, and Sketch
- Working with text, vectors, image fills, and masks
- Repeating elements with the powerful Repeat Grid tool
- Resizing multiple elements with responsive resize
- Using the new Assets panel to manage symbols, colors, and character styles
- Sharing symbols across files, with text and image overrides
- Creating and consuming bitmaps and vectors from CC Libraries
- Extending the power of XD using great plugins