How to write circular text in Figma?

Tutorial
March 20, 2023
3 min
circular text from the arc Figma plugin on a green background
Key points

Here are two methods, more or less simple... to create circular text in the collaborative design tool Figma.

1. Rotate each letter one by one

Of course, that's a joke; we’re not going to do that... 🤯 Unless you have a lot of time on your hands. A lot... and patience!

In case you're interested in this method, here’s how to proceed:

  • Create a circle using the “Ellipse” tool. Keyboard shortcut: O
  • Write each letter of the word independently
  • Place each letter around the circle
  • Use the Rotate function in the “Frame” tab to rotate them
  • Repeat this action for each letter

2. Use a plugin!

gif to showcase the arc plugin on Figma with circular text

Don’t waste time; Figma plugins are here to fill in all the functionalities that are not yet available in the tool. Among these plugins, you will find one dedicated to creating circular text. It’s called the arc plugin.

  1. Add the arc plugin to Figma: using this link, click on “Install” to add the plugin to your Figma account.
  2. Open your Figma project and select your text
  3. Open the arc plugin: right-click on the canvas > Plugin > arc
  4. Make your text more or less circular using the slider on the right
  5. Click “Apply” to create your circular text
Note that you should not rely on the preview provided by the plugin if your text is long.
Thomas Labonne
Thomas Labonne
Co-founder

Suggested articles

Abstract glowing visual with yellow and orange gradients, featuring the text “AI & DESIGN 2025” in the center, suggesting a theme focused on artificial intelligence and design in 2025.
Documentation
AI

How AI is transforming the Designer’s Role in 2025 (and why you won't be replaced)

How AI is transforming the Designer’s Role in 2025 (and why you won't be replaced)
Screenshot of the Webflow Partner directory showcasing several agencies: Digidop, Finsweet, Flow Ninja, and Simon Lampert. The blue background features the Webflow Partner logo on the left, while partner cards display their status, starting price, awards, and preview of delivered websites.
Documentation
Webflow

The Webflow Partner Program

The Webflow Partner Program
Agentic AI vs. Generative AI
Documentation
AI

Agentic AI vs. Generative AI: Key Differences and Real-World Applications

Agentic AI vs. Generative AI: Key Differences and Real-World Applications

Want to turn your website into your most valuable asset?

Contact us today