Skip to main content

Change the style of text and labels

To change the style of a text label, select the shape or connector, then select the Text tab in the format panel on the right.
Select a shape, then select the Text tab in the format panel to change its style

Change the font and font size​

  1. In the Text tab, click the drop down arrow next to the font name to see a list of installed and available fonts.
  2. Select a different font from the list.
  3. If you don't see the one you want to use, click Custom to add a new system, Google or web font.
    Change the font with the drop down list, or add a custom system, Google or web font
  4. In the font selection dialog, type the name of the new font in the appropriate section, and the URL if you are using a web font, then click Apply. The note in the example above uses the Architects Daughter Google font.
    Enter the name of the new font

Learn more about using external fonts

Increase the font size: Enter a new value in the text field just underneath the font dropdown list, or use the arrows to increase/decrease the font size. Alternatively, select the shape or label and press Ctrl+Shift +/- (Numpad) to increase or decrease the text size.
Change the size of the font by entering a new value

Tip: Copy and pasting styles will also copy the text style options from one shape to another.

Paste as plain text: Press Ctrl+Shift+V (Cmd+Shift+V on macOS) to paste copied text without its formatting, either onto the drawing canvas or into a label you are editing. In Safari, you may need to confirm the paste.

Change text and text background colours​

  1. Select the shape or connector where you want to change label colours.
  2. Click on the colour button next to the Font Color or Border Color checkbox to open the colour palette. For connector label backgrounds, select Solid in the Background list, then click on the colour button.
    Click on the colour button to choose a new font colour from the palette
  3. Select a new colour from the palette and click Apply.
    Select a new text colour from the colour palette

Choose the label background: Select an option in the Background list in the Text tab.

  • None: The label has no background, so the connector's line and shapes behind are visible through the text.
  • Solid: The label has a solid background colour. Click on the colour button next to the list to choose a different colour.
  • Transparent: The label has no background colour but the connector stops at the edges of the label rather than running through the text. The page background, gradients, shapes and other connectors beneath the label will be visible through the label. New connector labels are transparent. Set a different default label background style in the editor configuration labelBackgroundColor=default;defaultLabelBackgroundColor=page.
    Select Transparent in the Background list of the Text tab to show the page behind a connector label

Note: Transparent can only be applied on connector labels.

Add space around the label: Open the Advanced section in the Text tab and enter a value in Label Padding. For example, a single value e.g. 6 adds space on all sides of the label, whereas two values e.g. 2 10 adds 2 above and below and 10 to the left and right.

Style part of a text label​

Text labels in shapes and on connectors can be formatted with HTML, so you can apply a style to part of a text label. For example, you can apply bold, italicise, colour, or a link to just one word.

  1. Double click on a shape to select the label text, then drag a selection around just the text inside the label you want to style.
  2. Use the style options to
    • change the font and size; bold italicise, underline or strikethrough text
    • change the text justification
    • turn the text into a superscript or subscript
    • format the text as a list
    • increase/decrease the text indent
    • change the font or background colour of just that section
Format part of a label or insert a link on the selected text within a label

Edit the HTML formatting of the text: To apply complex formatting quickly, click the HTML button, then edit the HTML tags in the label. Click the HTML button again to switch back to the visual representation.
Edit the label's HTML formatting directly

Clear text formatting: Click the Clear Formatting button when you have selected text to remove bold, italics, and so on.
Select the text, then click Clear Formatting to reset the text styles to their default

Change the position of the text​

You can change how a text label is displayed in a shape by changing its position. Select the shape where you want to change the text alignment first. These options are only available when you have

Vertical text: Click on the Vertical button to switch to vertical text, and again to switch back to horizontal text.
Turn a text label to read vertically from the bottom up

Tip: Change the Writing Direction to read the text vertically from the top downwards.

Text position: Click Left, Center or Right to change the horizontal position, and Top, Middle or Bottom to change the vertical position.
Change the text alignment of labels to left, right or centred Change where the text label sits vertically within a shape

Text spacing: Select the shape, then change the Top, Left, Bottom, Right and/or Global values in the Spacing section of the Text tab in the format panel.
Add spacing to ensure text labels stay that distance away from the shape perimeter

Line spacing: Select the text inside the label where you want to change the line spacing, then change the Line Height value. Note that this option does not appear if you simply select the shape or connector - you must select some of the text within that label.
Change the line height of the text inside the label to increase or decrease the space between lines

Slanted text: The Misc shape library contains slanted text shapes next to Curved Text. Use them to place text on the left, right and top faces of isometric diagrams, such as AWS 3D diagrams. Double-click to change the text; the slant is retained.

Learn more about text alignment and positioning in shapes and on connectors