How do I set RGB colors?

In CSS you can specify RGB colors in the following ways:

# followed by a 6 digit RGB value in hexadecimal notation, e.g. #00ff00 for perfect green.

You can abbreviate this notation by using only 3 digits which will be expanded internally, e.g. #0f5 equals #00ff55.

Using the function rgb. It takes the 3 RGB component values as parameters in decimal or percent notation, e.g. rgb(0,255,0) or rgb(0%,100%,0%) for perfect green.

How do I set RGBA colors?

RGBA colors are also supported and can be specified by using the function rgba. It takes the 3 RGB component values as well as 1 alpha component value as parameters in decimal or percent notation, e.g. rgba(0,0,255,0.5) or rgba(0%,100%,0%,50%) for semi-translucent blue.

While it is currently possible to set RGBA colors on any CSS border, complex border settings (e.g. table cells borders) or border styles other than "solid" are not yet supported and may cause unexpected visual outcome.


How do I set CMYK colors?

Besides rgb and rgba PDFreactor also supports the non-standard function cmyk. It takes the 4 CMYK component values as parameters in decimal or percent notation, e.g. cmyk(0,0,1,0) or cmyk(0%,0%,100%,0%) for perfect yellow. An optional fifth parameter can be used to define the color's alpha value, e.g. cmyk(0%,0%,100%,0%,10%) would be a transparent yellow with an alpha of only 10%.


PDFreactor can automatically convert RGB colors into CMYK. See Color Space Conversion in the manual for more information.


CMYK colors are also supported in SVGs.


How do I set HSL colors?

HSL is another representation of the RGB color space. The hue value is in the range of 0 to 360, the saturation and lightness values range between 0 and 1. It is possible to set HSL colors using the function hsl. It takes the 3 HSL component values as parameters in decimal or percent notation, e.g. hsl(240,0,0) or hsl(66%,0%,0%) for blue. As with rgb, there is also the function hsla with an additional parameter for the alpha value.


How do I use color keywords?

Instead of using color functions or the hexadecimal notation a single human readable keyword can be used. For more information which keywords are supported by PDFreactor see the CSS Color Keywords table. The keywords are internally converted into the user-set color space. By default, they are converted into RGB colors.


How do I use spot colors?

Spot or separation colors, e.g. Pantone colors, are special named colors for professional printing. The specific color name is passed as is to the print workflow. As they cannot be displayed on screen (or printed without the correct named color), a fallback color must be specified, e.g. a similar CMYK color. A spot color can be used via the CSS functions -ro-spot and -ro-separation. The functions take three parameters: The spot color name, the color tint (with 1.0 representing maximum "opacity") and the fallback color.