Skip to main content
Question

Plugin window questions (docking and window size)


SLT-UX

This is a question for plugin developers…

Is there a min/max width and height for the dimensions of a plugin window? For example is it possible to make the plugin window very narrow (like 40 pixels for example), and make its height fill the height of the Figma application viewport?

Also, is it possible to “dock” the plugin window to either side (right, left, top, or bottom) of the Figma UI, so that it’s basically attached to one of these sides.

tank666
  • February 6, 2023

width: The width of the UI. Defaults to 300. Minimum is 70. Can be changed later using Figma.ui.resize(width, height)

height: The height of the UI. Defaults to 200. Minimum is 0. Can be changed later using Figma.ui.resize(width, height)
showUI | Plugin API

Yes you can. Just provide the required parameters in the above method.

You can specify the plugin’s modal window position in the above method, but not dock because Figma doesn’t natively have this feature.


SLT-UX
  • New Participant
  • February 6, 2023

Thanks for the quick response!

Re: specifying the plugin’s modal window position, can it be specified in a relative manner, or only in an absolute manner. In other words:

  1. Relative: 250px from the the right side of the Figma application viewport, and 25px from the top of the Figma application viewport.

  2. Absolute: 500px to the right, and 25px down, from the top left corner of the application viewport.

Also, can a plugin poll the current Figma application viewport’s dimensions? And if so, reposition itself accordingly?


tank666
  • February 6, 2023

SLT-UX
  • New Participant
  • February 6, 2023

Got it.

Well, it depends on what the plugin does 🙂 I have an idea for a plugin but in order for it to work well and have a good UX, it needs to behave more like a toolbar. That’s why I was asking about it being very narrow, and “docked” to a side of the Figma viewport.

But this is promising. I think the only limitation might be that only one plugin can run at a time. Hopefully Figma can take away that limitation, and allow maybe a few plugins to run at the same time (at least two lol).


Alex_FG
  • New Participant
  • February 12, 2023

Docking will be “possible” if you do it manually like you described. All we’re waiting for is for figma.ui.reposition() to officially become available and we’re good. (This will also allow for left edge window resizing.)

I’ve actually had everything prepared for docking in my plugin’s current dev version for a while, just waiting for this function. 😛

The next step is to let us remove the plugin window’s shadow and give it a panel-like border, so that it looks like a docked panel. 😛


SLT-UX
  • New Participant
  • February 14, 2023

Cool, good to see other folks wishing for a bit more versatility in how a plugin integrates with the rest of the Figma UI. Is your plugin out yet (the undocking version)? What does it do?


Alex_FG
  • New Participant
  • February 15, 2023

Hey, it’s this one: Generator | Figma Community. Lets you work with colors using a node graph.


parrot
  • New Participant
  • July 24, 2023

I found a way to dock a plugin using the reposition api. See it in use in my Plugin for Translation managment - Parrot.
Sadly there is a bug in the reposition function in Figma and there is no easy and robust way to get the xy position of the plugin atm - see Retrieve plugin UI position? and Get relative position of plugin UI window to main Figma window
So the solution i come up with involves a lot of little tricks. I am currently cleaning up the code and plan to publish it as a little library soon.


Jason_Burns

@parrot Did you ever end up sharing your code for docking anywhere? Curious to see how it works.


parrot
  • New Participant
  • January 14, 2025

Hey ​@Jason_Burns was busy with other stuff recently…
In the very end of the loom attached you see some details on how it works - pretty nasty hack so ;-).

Some good news: We gonna move the sources to the public repo of https://github.com/opral/monorepo pretty soon - i will keep you in the loop  

https://www.loom.com/share/6c73b515fceb471e90bd83bc8f2ca524

 


Reply


Cookie policy

We use cookies to enhance and personalize your experience. If you accept you agree to our full cookie policy. Learn more about our cookies.

 
Cookie settings