Emoji are being used in all communications at all levels of society - a single picture takes up less space and conveys more information than its matching text. You can use the Unicode emoji in shape and connector labels, and in tooltips in your diagrams.

Note: Emoji may appear differently on different operating systems and mobile devices, as not all emoji are supported on all platforms. Converting your diagram file to PDF from our online draw.io app, for example, will use the Windows emoji set.

This Unicode emoji list shows which emojis are available when using them in diagrams in a browser, or on different mobile device platforms.

Add an emoji to a label

If you are drawing in draw.io on a tablet or mobile device, you will have easy access to insert emoji directly from your mobile keyboard.

Otherwise, copy and paste the emoji from your browser from the Unicode emoji list.

1. Select the emoji you want to insert and press Ctrl+C to copy it.
2. Go to your diagram and select the shape or connector, then press Ctrl+V to paste the emoji as the shape or connector label.

Resize the emoji using the font size field in the Text tab in the format panel.

Add emoji to a tooltip

You can add tooltips to shapes and connectors. It will appear both in the editor when you hover over that shape, and in the diagram viewer.

1. Select the connector or shape or text that you want to add the tooltip too.
2. Select Edit > Tooltip from the menu, or press Alt+Shift+T.
3. Add the emoji to the tooltip via your mobile keyboard, or copy and paste them from the Unicode emoji list, then click Apply.

Now, when you hover over the shape in the editor, or in the diagram viewer, you’ll see the tooltip.

Note: The text size of tooltips is not changeable, and tooltips are not included when you export your diagram to an image or a PDF file.

Change the position of an emoji label

You can change the position of emoji in text labels in the Text tab of the format panel.

• Position - select another position from this dropdown list to move the label to another position around the shape. The default is usually Center, but some shapes may have their labels positioned at the Bottom.
  

• Alignment - The paragraph alignment moves the label to the left, center or right. And the vertical aignment moves the label to the top, middle or bottom of the shape. This also works when aligning labels inside table cells or lines in an entity shape.
  

• Vertical - click on the three upwards-pointing arrows will turn the label 90 degrees.
  

See how to style text (and emoji) labels

Follow us on GitHub, Twitter, Facebook.