0
0
Figmabi_tool~5 mins

Letter spacing and paragraph spacing in Figma - Step-by-Step Guide

Choose your learning style9 modes available
Introduction
Letter spacing and paragraph spacing help you control the space between letters and lines in your text. This makes your text easier to read and looks neat in reports or dashboards.
When you want to make a dashboard title stand out by adjusting space between letters
When your paragraph text looks crowded and you want to add space between lines for clarity
When you need consistent spacing in text blocks across multiple report pages
When you want to improve readability of labels on charts by adjusting letter spacing
When you want to fix overlapping text in a text box by increasing paragraph spacing
Steps
Step 1: Select the text layer
- Layers panel or directly on the canvas
The text layer is highlighted and text properties appear in the right sidebar
Step 2: Click the Text section
- Right sidebar
Text formatting options expand showing font, size, weight, and spacing controls
Step 3: Adjust letter spacing
- Letter spacing input box in the Text section
The space between each letter in the selected text changes immediately
💡 Use positive values to increase space and negative values to decrease space
Step 4: Adjust paragraph spacing
- Paragraph spacing input box in the Text section
The space between paragraphs in the selected text changes immediately
💡 Increase paragraph spacing to separate paragraphs clearly
Step 5: Click outside the text box
- Canvas area
Changes are applied and you see the updated text spacing on your design
Before vs After
Before
Text block with letters tightly spaced and paragraphs close together, making it hard to read
After
Text block with increased letter spacing and paragraph spacing, making text clearer and easier to read
Settings Reference
Letter spacing
📍 Right sidebar > Text section
Controls the space between individual letters in the text
Default: 0 px
Paragraph spacing
📍 Right sidebar > Text section
Controls the space between paragraphs in multi-paragraph text
Default: 0 px
Common Mistakes
Setting letter spacing too high
Makes text look broken and hard to read
Use small positive values and preview changes to keep text readable
Confusing letter spacing with paragraph spacing
Adjusting the wrong spacing does not fix the intended text layout issue
Use letter spacing for space between letters and paragraph spacing for space between paragraphs
Summary
Letter spacing adjusts space between letters to improve text appearance
Paragraph spacing adjusts space between paragraphs for better readability
Use the Text section in the right sidebar to change these settings in Figma