Add bold, italic, underline, and strikethrough styling directly to your product copy in Ditto, and see it reflected in your Figma designs — no need to style text twice.
Apply rich text to copy
Apply rich text to any text item from both the Ditto web app and the Figma plugin. Note, a single character can carry an underline or a strikethrough, but not both at once. ‘this matches how Figma handles text decoration, and Ditto follows the same rule so styling syncs correctly between the two.
Style your text:
Highlight the text you want to style
Apply a style using the toolbar buttons or a keyboard shortcut
Cmd/Ctrl + B — bold
Cmd/Ctrl + I — italic
Cmd/Ctrl + U — underline
Shift + Cmd/Ctrl + X — strikethrough
💡 Add the corresponding bold and italic font styles to Figma so those rich text style renders in your Figma screens
Use Figma styling when bolding an entire text item
If you bold an entire text item, Ditto won't apply bold styling and will give you an alert. This is intentional for bolding, since it's up for interpretation due to different font weights — so it's treated as a styling choice, and Ditto leaves it to Figma to handle. Italic, underline, and strikethrough don't have this ambiguity. The text is either styled or it isn't, so applying any of those to a full text item works as expected.
💡 To bold an entire piece of text on purpose, make that change directly in Figma.
Ordered and unordered lists
Add bulleted and numbered lists to your text items in Ditto, and sync list formatting between Ditto and your designs just like any other rich text.
Apply list format to a text item
Highlight the text you want to turn into a list
Use the formatting submenu that appears on highlight to choose Unordered list or Ordered
Alternatively, use keyboard shortcuts to create the list items
Unordered list: Type
*or-followed by spaceOrdered list: Type
1.followed by space
💡 Create nest list items up to 5 levels deep, matching Figma's indentation cap