Home forums How I created my first plugin for Figma in 5 mins

  • This topic is empty.
Viewing 0 reply threads
  • Author
    Posts
    • #4428 Reply
      finderpress
      Keymaster

      I have an OCD and hate if something done is wrong or not properly my way. So I needed a way to set a proper file background color

      Different Figma files at work have different background colours. Each designer sets his favourite colour or doesn’t care and uses the default colour or keeps the colour from some template file colour.

      I have an OCD. Each time I open a file with a “wrong” background colour I have to change it to a proper one. It takes time.

      If I can change the background colour quickly it will save much time and improve my mental health.

      Make a plugin for it! But how to do it?

      So let’s start. The first step is to press the “New plugin” button

      For my plugin, I chose that it’s only for Figma

      And decide that it needs a custom UI and a name.

      I now need to choose a space for it. I’m lazy and store everything on my Desktop.

      It’s created! But it can’t do anything yet.

      You can see a folder with templates of code files.

      Ok. Let’s go to Visual Studio Code. You need a code editor.

      And let’s open our folder with empty plugin files

      Now you can see the plugin’s code. It’s a kind of template.

      I can’t create code on my own. So let’s use ChatGPT! I use the 4th version. Not sure if the free version is as good. So just describe the plugin you want to get.

      It will provide all instructions as to what file and which code to copy-paste. No need to think at all.

      After you add code save changes and go to Figma to launch and test it.

      It doesn’t work immediately, unfortunately. Now we are starting the dumb part of the plugin-creating process. Check out below how I fixed errors.

      After each fix, I copy-paste code into Visual Studio, save changes, go to Figma and launch the plugin to test it.

      Once it works you are done and you can publish it to the community if you want. You can edit or unpublish it anytime you want.

Viewing 0 reply threads
Reply To: How I created my first plugin for Figma in 5 mins
Your information:




FREE CHEAT SHEET

Learn How to build a brand online and build authority 

This free (and highly detailed) cheat sheet will give you 20 smart strategies to help you grow your brand

No thanks, I don't want to build brand