# Text properties

> What each property of a text does: Origin, font, Max Font Size, Align, Spacing, Wrap, Enforce Uppercase, color, background and turned lines.

Source: https://bluepic.io/help/design-elements-and-tools/text-settings  
Language: en  
Category: design-elements-and-tools  
Last updated: 2026-10-22

In the properties panel you decide how a text looks and how it behaves when it gets longer or shorter. This matters most when the text comes from an input field and you don't know how much your users will type. How to add a text is described in [Design elements (images, text, shapes)](https://bluepic.io/help/design-elements-and-tools/design-elements).

You see the properties as soon as you select a text on the canvas or in the layers panel. They are in the sections **Position & Size**, **Text**, **Appearance** and **Transforms**.

![Text section of a selected text: Content, Font Style, Font Family, Max Font Size, Align, Spacing, Wrap, Enforce Uppercase and Curved Text.](https://imagedelivery.net/mudX-CmAqIANL8bxoNCToA/help/KB-text-settings-01/public){width="343"}

## Origin

At the top of the **Position & Size** section:

- **Origin**: the point in the text box where the text sits. The first three buttons set it horizontally (left, center, right), the other three vertically (top, middle, bottom). Top left by default.
- **Position**: where the Origin is on the canvas (X and Y).
- **Size**: width and height of the text box (W and H). The text always stays inside this box.

When the text is smaller than its box, it stays at the Origin. When it gets longer, it grows from there:

- Origin in the center: the text grows evenly to both sides.
- Origin bottom left: the text stays in the bottom-left corner and grows upwards and to the right.

This keeps text from a [text input field](https://bluepic.io/help/input-fields/text-input-fields) in place the same way, no matter how much users write. The horizontal Origin and [Align](#align) are linked: a left, center or right Origin is the same as left, centered or right alignment. If you change one, the other changes too.

![Position & Size section of a text next to the selected text on the canvas. An arrow points at the text's origin, left in the middle.](https://imagedelivery.net/mudX-CmAqIANL8bxoNCToA/help/KB-text-origin-01/public?v=3b6d1869){width="1479"}

## Content

- **Content**: the text itself. When you make the text changeable with an input field, this content becomes the input field's default value.

## Font

- **Font Style**: the weight and style of the font, for example **Bold** or **Light italic**. The list only shows what the chosen font has.
- **Font Family**: the font. The button shows its name, and a click opens the list of all fonts. The text switches to the chosen font right away. Inter by default.

To use your own brand font, see [Upload a font: use your own fonts in templates](https://bluepic.io/help/design-elements-and-tools/importing-fonts).

## Max Font Size

- **Max Font Size**: the largest size the text can have. If the text does not fit its box at this size, it gets smaller until it fits. It never gets bigger than the Max Font Size. 52 by default.

This lets one design hold text of any length. Longer entries from an input field get smaller on their own instead of spilling out of the box. How the text gets smaller depends on [Wrap](#wrap).

> **Tip:** You can also set the Max Font Size by dragging on the canvas: in the **Scale** mode of the cursor button, see [Design tools (zoom, align, scale, move)](https://bluepic.io/help/design-elements-and-tools/design-tools). If you drag a handle in **Select** mode instead, you only change the size of the box. Hold **Shift** while dragging to change the Max Font Size along with it.

![Max Font Size in the Text section next to the selected name text on the canvas.](https://imagedelivery.net/mudX-CmAqIANL8bxoNCToA/help/KB-text-settings-03/public?v=e83cf572){width="1479"}

## Align

- **Align**: aligns the lines left, center or right. Left by default. The text box stays where it is. **Align** also sets the horizontal [Origin](#origin), so a longer text grows in the matching direction.

## Spacing

**Spacing** has two fields. Type a number or drag on the field.

- Left field: the line height. At 100 the lines have the font's normal spacing. Higher values add room between lines, lower values move them closer. 120 by default.
- Right field: the letter spacing. 100 is the font's normal spacing. Higher values spread the letters apart, lower values pull them together. 100 by default.

## Wrap

In the **Text Settings** row:

- **Wrap**: decides what happens when a text is wider than its box. On by default.
  - On: the text breaks onto new lines to stay inside the box. If there is still not enough room, it gets smaller.
  - Off: the text keeps the line breaks you typed and never breaks on its own. Instead, the whole text gets smaller until it fits the box.

Either way, the text stays inside its box and starts at its [Max Font Size](#max-font-size). With Wrap on, long text uses more lines. With Wrap off, it gets smaller.

![Text Settings with Wrap switched on.](https://imagedelivery.net/mudX-CmAqIANL8bxoNCToA/help/KB-text-wrap-01/public){width="339"}

## Enforce Uppercase

- **Enforce Uppercase**: shows the text in capital letters only. The text you typed stays unchanged, only the display changes. This also works for text from an input field: whatever your users type shows in capitals. Off by default.

## Curved Text

- **Curved Text**: makes the text run along a path. Off by default. When it is ticked, these appear below it:
  - **Path**: the path the text follows.
  - **Baseline**: how the letters sit on the path: **Baseline**, **Middle** or **Hanging**. **Baseline** by default.
  - **Offset**: the distance of the text from the start (**left**) and the end (**right**) of the path. 0 by default.

![Curved Text in the Text section: the role text of the profile picture frame runs along a round path on the canvas.](https://imagedelivery.net/mudX-CmAqIANL8bxoNCToA/help/KB-text-settings-04/public?v=19ea5470){width="1459"}

How it works is described in [Put text on a curve](https://bluepic.io/help/design-elements-and-tools/curved-text).

## Color and background

In the **Appearance** section:

- **Fill Color**: the color of the letters. Black by default. Without the tick, the text has no fill.
- **Stroke Color**: an outline around the letters. Off by default.
- **Background Color**: a background behind the text. Off by default.
- **Background Stroke Color**: an outline around the background. Off by default.

As soon as the background has a color or an outline, more properties appear:

- **Background Corner Radius**: rounds the corners of the background.
- **Background Clip**: how far the background reaches. **Text Frame** fills the whole text box (default). **Text** puts one rectangle tightly around all lines. **Per Line** gives every line its own background.
- **Background Padding**: makes the background bigger by this distance.

![Appearance section of a text with Background Color switched on and the Background Clip menu open: Text Frame, Text and Per Line.](https://imagedelivery.net/mudX-CmAqIANL8bxoNCToA/help/KB-design-elements-02/public){width="938"}

For gradients, see [Set colors and gradients](https://bluepic.io/help/design-elements-and-tools/colors-and-gradients).

## Turn and slant lines

At the end of the **Transforms** section. If the section is closed, click **Transforms**. All values are in degrees and 0 by default.

- **Rotate Text**, **Line °**: turns each line on its own. The whole element stays straight.
- **Rotate Text**, **Char °**: turns each letter on its own. The line itself stays straight.
- **Skew Lines**, **X °** and **Y °**: slants each line sideways (X) or up and down (Y).

Turned or slanted lines can reach past the text box. To turn the whole element, use **Rotate** further up in the same section.

![Transforms section of a text with Rotate Text (Line 10°) and Skew Lines (X 15°) set.](https://imagedelivery.net/mudX-CmAqIANL8bxoNCToA/help/KB-text-settings-02/public){width="343"}

> **Tip:** Like other properties, these can hold an expression or be connected to an input field. For example, a checkbox input field can switch **Enforce Uppercase** on and off. More in [How elements, properties and input fields fit together](https://bluepic.io/help/input-fields/elements-properties-input-fields).

## Related articles

- [Design elements (images, text, shapes)](https://bluepic.io/help/design-elements-and-tools/design-elements)
- [Put text on a curve](https://bluepic.io/help/design-elements-and-tools/curved-text)
- [Text input fields](https://bluepic.io/help/input-fields/text-input-fields)
- [Upload a font: use your own fonts in templates](https://bluepic.io/help/design-elements-and-tools/importing-fonts)