The color dialog is the same for most use cases in Stylo. The title can provide details, such as whether it is the foreground or background color. In a single selection, the selected object is also displayed.

Below, you will get an impression of how the dialog is operated:

The dialog usually consists of four sections:

• Palette
• CMYK/RGB
• HTML notation
• Gradients

Which sections are visible in the dialog is determined by the Stylo partner (display or production system), by specifying the color in the document, or again by the partner. The sections can also be restricted by permission settings.

Palette

The palette displays the available colors. These colors can be

• specified by the production system,
• derived from the display system depending on the order, or
• derived from the display system depending on the customer

specified. If the colors are not specified by the leading system, standard colors from Stylo will be used, which are stored in the program's configuration.

When you select a color from the list, the color values are applied to the chosen object or text. There is no reference to the name, which means that if the values for the palette entries change, it does not affect the objects to which a color value from the palette has been assigned. The palette is not a color catalog in that sense.

A restriction to colors with specific names is possible using the filter.

The options for black, white, and transparent are always available.

CMYK/RGB

Depending on the color model selected in the display, users will see the sliders for color mixing. The values can also be entered directly in the input fields next to the sliders.

🙋🏼‍♀️ What does CMYK stand for?

CMYK stands for the four color inks used in the professional printing process: Cyan, Magenta, Yellow, and Key (Black). These letters represent the colors light blue, pink, yellow, and black.

In the printing process, these four colors are printed in various combinations and amounts on top of each other to create a wide range of colors. You can think of it like mixing colors: By layering and combining the primary colors, new shades are created.

The reason black is referred to as "Key" is that it is the main color used to create contrasts and highlight fine details in images. If you were to mix only cyan, magenta, and yellow, you would not get a rich black, but rather dark brown tones, which is why black is added separately.

CMYK is crucial for the printing process because this method allows for colorful and detailed print results on paper and other materials. It is the standard in the printing industry, especially for anything produced in bulk, such as magazines, posters, and packaging.

🙋🏼‍♀️ What does RGB stand for?

RGB stands for "Red, Green, Blue" and is a color space used to represent colors on screens such as televisions, computers, and smartphones. In this color system, colors are created by combining varying intensities of light in the three primary colors red, green, and blue. For example, higher intensities of these colors produce white, while the absence of light results in black.

RGB is not ideal for the printing process, as printers work with the CMYK color space, which consists of the colors cyan, magenta, yellow, and black. These colors are produced by mixing pigments on paper, unlike mixing light as in the RGB system.

An image created or displayed in RGB must be converted to CMYK for printing. This conversion can cause the colors on the printed material to look different than on a screen, as some bright colors in the RGB spectrum cannot be accurately reproduced in CMYK printing.

HTML Notation

In this section of the color dialog, you can read the current color as an HTML color. The representation is provided in both RGB notation and CMYK.

Custom Colors

You can save colors that you use frequently in the "Custom Colors" storage. The saved colors have no relation to the document you are working on – they are linked to the profile (browser, computer) you are currently using.

+: With the symbol, you can add the currently selected color to the list. If the list is already full, the last entry will be deleted.

Delete: Called via the context menu. The selected color will be deleted.

Change: Called via the context menu. The selected color will be overwritten with the current color entry.

Tone Value

Through the tone value, you determine the coverage of a color – the background will not be visible with the determination of the value. If you want to achieve this, use the slider for the "Transparency" value.

In the following example, you can see objects from left to right with a tone value of 100%, 70%, and 40%.

You can set the tone value by entering a value between 0 and 100 for a background color, a border color, and a text color. When selecting a new color from a color palette or by specifying the color parameters, for example, using the sliders, the tone value is preset to the default value of 100.

Transparency (Alpha Value)

This slider can influence the opacity of the object. Objects behind the object will show through, depending on the strength of the transparency value (also called alpha value).

In the following example, you can see objects from left to right with a transparency value of 100%, 70%, and 40%.

The slider has no effect on the border of an object and is therefore disabled for these. When selecting objects to which no transparency can be assigned, the slider and the value field are grayed out.

Gradients

A gradient is a design technique where one color smoothly transitions into another. Imagine you have two colors, for example, blue and yellow. A gradient would then include the intermediate colors, such as green or various shades of blue and yellow, that ensure the transition from blue to yellow appears smooth and seamless. It’s like a rainbow transforming from one color to another, and it is often used to make designs more vibrant and interesting.

Gradients can be applied to graphic objects (except images). At this point, you only have the option to choose from existing gradients. Creation is done through the gradient catalog, where you can also change the composition. The gradients displayed in the catalog are usually predefined in the template.

No tone value changes or transparencies can be applied to gradients within the color dialog.