Display Multiple Swatches Based on the Number of Characters
In addition to displaying a single alphabet based on the first character, Customix also allows you to display multiple swatches dynamically, depending on how many characters the customer enters.
This is useful for designs where each character needs its own letter image, such as full names or multi-letter monograms.
How It Works
- Each character in the text input is mapped to one swatch
- The number of visible swatches automatically adjusts to the number of characters entered
- You can optionally limit or control layouts based on text length
1. Step 1: Prepare the Alphabet Asset Folder
First, prepare a folder that contains alphabet images in strict order, starting with an empty file:
- The first file must be an empty image (used when no character is detected).
- The following files should represent letters A → Z in order.

2. Step 2: Upload Alphabet Assets to Customix
- Go to Customix Personalizer → Assets
- Upload the entire alphabet folder you prepared
- Keep all alphabet images inside the same folder (for example: Alphabet Style 2)

3. Step 3: Create a Template and Add the Alphabet Layer
- Create a new template (or open an existing one)
- Add the alphabet folder you uploaded to the template
- Position and resize the alphabet layer as needed in your design

4. Step 4: Add a Text Input Field
- Add a Text layer (for example: Enter Name)
- Enable Personalize for this text field as usual
- On the right-side settings panel, enable: "Display swatches by characters"
- Select the alphabet layer you created earlier (e.g. Alphabet Style 2) and assign it to Character 1
You can also assign as many swatches as needed, for example:
- Character 1 → the first swatch
- Character 2 → the second swatch

The last step, to avoid customers manually selecting alphabet images, you should go to the Option Sets tab and hide the Alphabet Style 2 option set. This setup enables automatic alphabet display based on the first character, without requiring customers to interact with image swatches manually.

If you’re looking for a more advanced use case where the layout is automatically adjusted based on the number of text inputs, please refer to our dedicated guide: “Dynamic Layout Display Based on Text Count”
Updated on: 30/01/2026
Thank you!