Allow us to dock/move the new UI3 toolbar

​@dvaliao Any official response to this? I have to agree with the Figma designers above.  I used to enjoy using Figma but this toolbar is totally ruining the experience and is always in the way. At the very least let us dock it back (see mockup above). It’s not a hard change, and will be a welcome change. 

Thank you. 

I feel you 100%. One of the key things to learn as a designer is not getting attached to design decisions, especially poor design decisions. I’m sure the Figma design team would agree with this.

Typically, product release decisions ultimately fall on one person in the product team and it’s not necessarily someone on the Design Team (it’s often the product manager or product owner).

Let’s hope they do the right thing. 

​@SLT-UX I actually use Arc browser which has it built in with the boosts feature, but for any other browser, just search for any CSS injection extension and that should work. I think one I’ve seen before is just called CSS Inject and it’s for Chrome browsers on the web store.

​@dvaliao  do you have an official response now please? This post has had over 6000 views - it’s clearly an issue for users.

+1 to
 

Everything everyone else said
PLEASE
and thank you

Until Figma addresses this, the two best solutions for me are the snippets shared earlier in this thread—just add these to Figma’s web dev tools. MoveToolbar moves it to the top, RemoveToolbar hides it completely (until next restart).

1. In Figma:
   • Go to Help › Troubleshooting › Toggle Web App Developer Tools. 
   • Or, press Cmd+Opt+ I (macOS)
2. In the dev tools window go to:
   • Sources › Snippets.
3. Click New snippet
4. Name it MoveToolbar then paste this code on the right:

   document.head.innerHTML += "<style id='jolo'>div[class*='tool_group--pointingDropdown'] div[class^='dropdown--dropdown'][style]{top: 80px !important; bottom: auto !important;}div[class^='positioned_design_toolbelt--root--'][style]{top: 25px !important; bottom: auto !important;}</style>"

5. Click New snippet again
6. Name it RemoveToolbar then paste this code:

   function addStyle(styleString) {
     const style = document.createElement('style');
     style.textContent = styleString;
     document.head.append(style);
   }
   addStyle(`
     .positioned_design_toolbelt--root--INYO4
     {
       display: none !important;
     }
   `);

7. Right-click the snippet you want then click Run
    

   

The only drawback is that it doesn’t persist after a restart, so you’ll need to rerun it each time you quit Figma, but learning the Dev Tools shortcut helps: Cmd+Opt+ I on macOS, and I think it’s Ctrl+Shift+I on Windows.

I agree with all the comments above -the floating toolbar is in the way and get’s easily hidden behind the doc on a mac. Coming back to Figma from XD to find the floating toolbar at the bottom and no option of docking it elsewhere, was a huge disappointment. Please listen to your users, or soon you’ll have less of them.

Thank you ​@Uhl !!! This solution is awesome! Hopefully Figma will get their sh*t together so I won’t have to run this every time I restart Figma.

The toolbar should be at the top in the header or on the left/top of the canvas area or better yet, let users dock it where they wish how almost every other creative/design app lets you position the main toolbar. 

The toolbar feels so counterintuitive, out of place, and in the way at the bottom of the window where it is.

Can you share the reasoning behind moving the main menu to the bottom in UI3? Understanding the thought process might help us adapt or provide more targeted feedback.

The decision to move the tools menu to the bottom significantly disrupts long-established workflows across many programs. For many users, this breaks muscle memory developed over years of use, slowing down productivity and making everyday tasks feel less intuitive.