Skip to main content
Text is the most common personalizable element. Customei supports three flavors of text layer, each backed by its own rendering engine.

​
Three kinds of text

KindBest forEditor control
Regular textNames, labels, simple headlinesA text box with font, size, color, alignment
Curved textMug wraps, arched banners, circular badgesFollows a configurable curve (arc, circle, path)
Warped textDistorted logos, perspective effectsDeformed through a mesh grid you can bend interactively
All three can be bound to option fields, so a customer typing into a text input updates the layer in real time on the storefront.

​
Add a regular text layer

1

Pick Text from the Add panel

Or press T while the canvas has focus.
2

Click the canvas

A text layer appears with placeholder content.
3

Edit the content

Double-click to enter edit mode, or change the text in the right-panel Properties section.
4

Style it

Pick a font, size, color, and alignment from the Properties panel.

​
Text properties

From the Properties panel, a selected text layer exposes:
  • Content — the string itself.
  • Font family — any font in your library, plus a curated default list.
  • Font size — in pixels.
  • Fill color — hex or swatch picker.
  • Stroke — outline color + width (useful for text over busy photos).
  • Alignment — left, center, right.
  • Line height and letter spacing — for multi-line or stylized text.
  • Opacity — 0–100%.

​
Fonts

Customei ships with a set of web-safe defaults. To use a custom brand font, upload the font file (.ttf, .otf, .woff2) to your Library. Uploaded fonts appear in every template’s font picker.
Font licensing is your responsibility. Only upload fonts you have the right to use in commercial products.

​
Curved text

Curved text follows a curve you can shape interactively.
1

Pick Curved text from the Add panel

Or convert an existing text layer via Type → Curved in the Properties panel.
2

Type your content

The text flows along the default arc.
3

Shape the curve

In the Properties panel, adjust:
  • Curve type — arc, circle, or custom path.
  • Bend — how strongly the arc curves (negative values curve downward).
  • Radius — tighter or wider curves.
Curved text is perfect for circular badges (“Made in Vietnam” around a seal) or mug wraps where the text needs to follow the product’s shape.

​
Warped text

Warped text deforms through a 2D mesh grid. Move grid points to push, pull, or distort individual parts of the string.
1

Pick Warped text from the Add panel

The layer appears with a visible grid overlay.
2

Drag grid points

Each corner and edge has a handle. Drag to warp the text. The handles stay visible while the layer is selected.
3

Reset

Right-click → Reset warp to return the grid to a flat rectangle.
Warped text is the best choice when you need a pre-baked distortion (like a logo in perspective) that should stay intact as the customer edits the content.

​
Binding text to option-set fields

A text layer becomes customer-editable when you bind it to an option-set field:
  1. Open the option set that targets this template.
  2. Add a Text field.
  3. In the field’s settings, pick Bound layer → your text layer.
  4. Save.
Now whatever the customer types on the storefront is rendered into the layer, using the font and styling you chose here. You can also bind color separately — a Swatch field can drive the fill color of a text layer, while a Text field drives its content. That’s how you get combinations like “Pick a name and a ink color”.

​
Tips

  • Keep copy short. Long strings in small canvases look cramped and pixelate in print. Set a character limit on the option field.
  • Stroke over busy images. A 2–4 px stroke keeps text readable against photo backgrounds.
  • Curved text hates small radii. Tight arcs squash individual glyphs; test on the mockup before publishing.

​
Next