Articles on: Customization Management

Colorization Methods & Setup

Fancy Product Designer provides several options to let your customers recolor text, SVG files, and PNG images directly in the Product Designer. With the right setup, you can give them complete flexibility or restrict choices to fit your brand style.

Supported Elements for colorization

All Text Elements → fully colorizable
SVG Images → supported (single-path SVGs work best for linked colors)
PNG Images → supported with additional Color Modes (see below)

Other image formats (JPG, GIF, etc.) cannot be recolored.

Colorization Options

There are generally two options you can offer for coloring elements in our app: The Color Picker and the Color Palette. Also, there are different places in the app where coloring options can be assigned.

1. Color Picker

Enter a single hex value (e.g., #000000) in the settings.
This enables a color wheel where customers can choose any color they like.

Color Picker

2. Color Palette

Enter multiple hex values (e.g., #000000, #FF0000, #008000).
Customers will see a preset palette instead of a free picker.
This keeps color choices consistent with your brand or product requirements.

Color Palette

Color Link Group

If you want to make sure that multiple elements will always keep the same color, the Color Link Group is your way to go.

Navigate to the Product Builder
Select the elements you want to link one at a time
Assign a unique link ID to group elements together
When one element’s color is changed, all linked elements update at the same time

Color Link Groups work with:

Text elements
PNG images
Single-path SVG images

Color Link Group

Example: Link the front and back image of a t-shirt so the customer only picks a color once.

PNG Color Modes

When working with PNG images, you can select a color mode to control how recoloring behaves:

Colorization Mode

Mode	Resulting Effect	Best Use Case
Tint	Recolors the entire image with the chosen hue, while preserving light/dark balance	Theming icons or graphics to match brand colors
Multiply	Applies a color cast that blends with the original hues and darkens the image	Adding depth or tinting photos — works best on white base PNGs

For clothing mockups (like t-shirts), use Multiply mode to simulate realistic recoloring. However, this mode doesn't work well with dark colors so use a white product image to start with.

Color Lists

If you want to offer the same set of colors in different places, you don't need to enter the hex codes for those colors everywhere. You can just create a Color List and select the list everywhere those colors should be used.

To create a Color List:

navigate to Resources > Colors
scroll down to the bottom and enter the name for the Color List
add the color hex codes of the colors you want to add to the list

Create Color List

Color Lists can be used in most places where colors can be set.

Where to set Color Options

You can define colorization settings in several places:

Single Elements in Product Builder

While building a product, single elements can be selected
In the Element Options, open the Colors segment
Set its available colorization options

Colors in Product Builder

General Settings > Element Properties

Go to the General Settings > Element Properties
Open Images & Designs or Custom Texts
Scroll down until you see the input field **Colors **
Enter the hex codes of the colors you want to be available on all uploaded images or texts

Element Properties

Customization Profiles

Navigate to General Settings > Customization Profiles
Open the Profile you want to change and select the Colors tab
Select the color options you want to offer

Color Selection in Profiles

Single Designs & Design Categories

Go to the Designs backend
Open Category Options or Single Design Options
In the Colors tab, select the color options you want to offer

Color Selection in Designs

Color Selection Panel

Aside from the toolbar color selection, you can also offer the color selection for predefined elements directly on the product page. Details on this option and how to set it up you can find here. This is how this setup option will look like:

Color Selection Panel

Summary

There are multiple ways to offer coloring in the Fancy Product Designer app. In essence, there are two options to offer colorization:

Color Picker = unlimited colors
Color Palette = restricted set of brand colors

Additinally, there are a few useful tools and options:

Color Link Group = synchronize multiple elements
Color Lists = a preset group of colors you can use in different places
PNG image Color Modes (Tint & Multiply) = flexible recoloring with realistic effects

Use these tools strategically to balance creative freedom with brand consistency.

If there are any questions left just reach out to us in our in-app chat.

Updated on: 05/01/2026

Was this article helpful?

Thank you!