How to Add Symbols in Figma: Smart Symbols, Emoji and Glyphs

How-To Guides · 3 min read · Published October 25, 2026

Quick answer: in a Figma text layer, turn on Main menu → Preferences → Use smart quotes/symbols so that -> becomes →, (c) becomes © and (tm) becomes ™. Type : and a word for emoji. For any other character, paste it or use Win+. / Ctrl+Cmd+Space. For interface icons, use vector components rather than characters.

Quick reference: every method

Every Alt code below is verified against the real Windows code pages — where none exists we say so, rather than list one that won’t work.

Smart symbols

With Use smart quotes/symbols turned on (in Figma Design files), these combinations convert as you type:

The same setting turns straight quotes into curly ones. Switch it off when a text layer shows code, a CSS value or a measurement, where straight quotes are correct (straight vs curly quotes).

Emoji

Type : followed by the emoji name or a keyword, such as :heart or :plus, and choose from the list. This works in Figma Design, FigJam and Figma Slides. Figma draws emoji in the Apple style. The system pickers work too: Ctrl+Cmd+Space on a Mac, Win+. on Windows.

Every other character

• Paste it from a symbol page, for example the right arrow or bullet.
• Mac Option keys: Option+8 •, Shift+Option+- —, Option+; … (full list).
• Windows Alt codes for codes up to 255, such as Alt+0151 — and Alt+0133 …, typed on the numeric keypad while editing the text layer. If the browser or app ignores them, use the emoji panel or paste.

Fonts and missing glyphs

If a symbol appears in a different style from its font, or as an empty box, the font does not contain that character and a fallback is being used. That fallback may differ on a developer's machine, so the build can look different from the design. Pick a font that includes the symbol, or switch to an icon. See why symbols show as boxes.

Icon fonts such as Material Symbols work differently: with the icon font applied, you type the icon's name (for example "home") and a ligature turns the word into the icon. This only works while that font is applied, so the word comes back if the font is changed.

Characters or icon components?

• Use characters for typographic marks inside copy: → in "Learn more →", •, ©, °, ×, the em dash.
• Use vector icons (components from an icon library) for buttons, navigation and status icons. They look the same on every device and can be exported as SVG.
• Remember accessibility: a screen reader reads → as "right arrow". If it is decoration only, the developer should hide it from assistive technology (symbols and screen readers).

Related: symbols in Canva and arrow symbols.

Frequently asked questions