Text Boxes are places where customers can type their own custom text. The box sets the boundaries where text can be typed, and is represented on the canvas by a dashed line around the text. You can format texts in many ways to give customers further options.

• How to add a text box
• Transform the text box
• Format the text box
• Color the text box
• Advanced settings
• How to test how the text will look

To add a text box

You can add text boxes on Designs and on Templates, by clicking the Text Box button.

Each text box that you add will have a Name that you can edit, and a Unique Id for you to easily identify it. 

Transform the text box

Directly on the canvas or by expanding the Transform toolbox, you can transform the text box:

• Position
• Rotation
• Size
• Skew
• Order

Format the text box

After selecting the element, expand the Character toolbox to format the text inside the text box. Click on each item to learn more:

• Font Option
• Min and Max font size
• Alignment
• Tracking and Line Spacing
• Automatic Multiline
• All Caps

Font Option

You can apply one or multiple fonts to a text element.

1. Select the text element
2. Expand the Character toolbox
3. Click to expand the Select a Font list
4. Pick a font from the list
5. A dialog will confirm that the Font was correctly applied

New accounts will only have 1 font available, as Customily does not provide fonts. But you can easily add as many fonts as you want to your font list.

Learn how to import fonts into Customily here.

Font Size

Text boxes in Customily have a font size range, meaning you can set a minimum and a maximum font size. This is to allow text to resize when customers type something super long (making the text smaller to fit more characters).

We recommend using the Max Size as the size that you want. The Min Size will be the limit of the resizing, to ensure that small texts still look good and are printable, leaving the value that comes by default is a great choice. If you don't want the text to be able to resize at all, you should use the same value on both.

1. Select the text element
2. Expand the Character toolbox
3. Type in the Min and Max font size in points (pts)

Alignment

You can align a text inside the textbox horizontally and vertically. 

- Horizontally: Left, Center, Right, Justified

- Vertically: Top, Center, Bottom

1. Select the text element
2. Expand the Character toolbox
3. Select from the dropdown the Horizontal Alignment and the Vertical Alignment.

Tracking and Line Spacing

You can adjust the tracking (character spacing) and/or leading (line spacing) of your text by inputting the values. Both tracking and leading are expressed in %.

1. Select the text element
2. Expand the Character toolbox
3. Type in a value you want for Tracking or Line Spacing.

Automatic Multiline

When a text box has enough height to fit multiple lines, it is multi-line by default. However, in order to jump to the next line, customers will have to hit Enter (return). If you want the text to jump to the next line automatically, then you should activate Automatic Multiline. This way, when the text hits the boundaries, a breakpoint will be added automatically.
So for long texts, they will automatically continue to the next line without the customer having to press the Enter key.

1. Select the text element
2. Expand the Character toolbox
3. Click the Automatic Multiline checkbox

All Caps

By checking All Caps, you'll force whatever text a customer types into capital letters.

1. Select the text element
2. Expand the Character toolbox
3. Click the All caps checkbox

Color the text box

After selecting the element, expand the Color toolbox to add color options to the text inside the text box. Click on each item to learn more:

• Fill Color
• Stroke
• Texture*

Fill Color

You can apply one or multiple fill colors to a text element. You can assign colors by Hex value, RGB-A, CMYK-A, or by using a color picker. The color chart will change from RGB-A to CMYK-A, according to the color mode of your workspace. The A stands for Alpha, which means you can also add transparency to your text colors!

1. Select the text element
2. Expand the Color toolbox
3. Click the color swatch or the color picker to select a color. Using the swatch you can add colors with Hex, RGB-A, or CMYK-A values (the last 2 depend on the color mode of your design). If you want to add transparency, just slide the Alpha control on the bottom of the chart.
4. A dialog will confirm that the Color was correctly applied

Stroke

You can apply a colored stroke to the text element, this can be a different color from the fill color. The stroke will apply to the text always, so if you have multiple font options and multiple color options, the stroke will apply to all of them.

1. Select the text element
2. Expand the Color toolbox
3. Set the Stroke width
4. Click the color swatch or the color picker to select a color for the stroke. 

Texture

On some occasions, you can add texture to your text. This is exclusively available when working on templates (for now!).

1. Open the template and go to step 2
2. Select the text element
3. Expand the Color toolbox
4. Select the texture you want to use. Most textures have an opacity, so you can still see the color options behind them.

Advanced Settings

The advanced settings let you add a Prefix and/or a Suffix to your text. This will be some fixed text that will be visible when customers start adding their custom text.

• Prefix: a fixed text will be added before the custom text
• Suffix: a fixed text will be added after the custom text

1. Select the text element
2. Expand the Advanced toolbox
3. Set the Stroke width
4. Click the color swatch or the color picker to select a color for the stroke. 

Test how the text will look

At any moment while configuring your text box, you can test how it will look on your design, by typing on the spot that reads Type to try the text box.

This is just for you to test, whatever you type there won't be saved, and won't be visible to your customers ever.