Guide

How to Make a Button in Figma

This guide will walk you through the steps to create a button in Figma. Follow each step carefully to design a centered button effectively.

Interactive tour · Open canonical tour
  1. Create a Shape – Use the Rectangle Tool (R) to draw the base of your button. Adjust size to fit your design.

  2. Add Text – Select the Text Tool (T) and type your button label (e.g., “Submit” or “Click Me”).

  3. Center the Text – Align the text in the center of the shape using Figma’s alignment tools.

  4. Group Elements – Select both shape and text, then press Ctrl/Cmd + G to group them together.

  5. Add Fill and Border Radius – Customize button color and round the corners using the right panel.

  6. Create a Component – With the button selected, press Ctrl/Cmd + Alt + K to turn it into a reusable component.

  7. Add Interactions (Optional) – Use Prototype tab to link the button to other frames or actions.