Balsamiq Community Discussion

Resizing of Symbols


I have a potential feature request. Currently, when you group shapes and promote them to “Symbol” status, they work great until you resize them. When you resize, all contained shapes resize and anything in the symbol that is not in the upper left corner gets moved proportionally. This is not always desired.

What would be better would be to be able to have more control over what happens to contained shapes when their containing symbol is resized. In particular, it would be good to be able to specify:

  • [_] Resize vertically (or always stays the same height)
  • [_] Resize horizontally (or always stays the same width)
  • Horizontal Anchor [Left, Center, Right]
  • Vertical Anchor [Top, Center, Right]
  • [_] Resize horizontal margin on horizontal resize (or always stay at the same pixel offset from the Horizontal Anchor)
  • [_] Resize vertical margin on vertical resize (or always stay at the same pixel offset from the Vertical Anchor)

The “Resize” settings would turn on/off whether the shape resizes proportionally when the containing symbol changes size. (Currently all of them seem to.)

The “Anchor” settings would all shapes to be anchored to the right or bottom edges so that, even if something gets stretched, it will stay on the right and/or bottom edge (or will always stay centered if anchored to that.)

The “Resize Margin” settings would only come into play of a shape was not flush-with its anchor edge. For example: if a shape were anchored to the right side and was 10px from the right … then the user stretches the symbol to twice the width: if this setting were TRUE, the shape would be 20px from the right. If FALSE, the shape would still be 10px from the right.

This may not be perfect but would help make more meaningful symbols that behave better when resizing.


We definitely have some ideas on how to make this better in the future, @bbeswick, but we need to make sure it’s done right. Ideally, we’d love it if there wasn’t a lot of the complexity exposed to the user, and the software just did it the right way on its own. It’s going to take some work, that’s for sure, but it is on our radar!

Thanks for the idea, @bbeswick! Keep 'em coming :smiley:


Finding the right balance between power and complexity is always a challenge, as you know. One approach for consideration could be to treat the creation of full-blown custom symbols as an “advanced” capability and provide a powerful (but sophisticated) configuration setup for those power-users that have the gumption to do that. Those symbols could then be optionally uploaded to a free “market place” on your site where your users could share their best and brightest ideas. That way, those that aren’t as technical can benefit from the work of those that are highly-technical.

In all cases, thank you for your consideration and congratulations on such a great product.


Some symbols, such as the Browser, are the perfect candidate for some resizing help.

I used the browser asset and included other objects, such as icons, and then made it a symbol so I can use that assembled object. As with any browser window, there are needs to resize the height according to content. However, when you do, the icons within the browser symbol also resizes, which as you might imagine, is not the desired affect.

If you do resize and then undo that resize, it always messes up the embedded icons.

I am using the desktop version: Version: 3.4.1 gnd-FkD-SCN-6eB


Sorry for the hassle with this @GetzPro.

Here is a quick way for you to prevent this from happening: you can modify the height of the browser control and only this one by overriding the symbol properties. All you need to do is to double-click on the symbol to “enter it” and then edit only the browser control. This will allow you to adjust the height for this instance of the symbol while other instances keep their default height.

Hope this helps! Please let us know if you need anything else. :slight_smile: