4D Doc Center : SVG Colors

4D v13

SVG Colors

Definition of colors

SVG recognizes all the alternative syntaxes for the colors defined in the CSS2 standard. The commands of the 4D SVG component support all these syntaxes.

A color can be expressed in one of the following forms:

RGB format
Format Example
#rgb #f00
#rrggbb #ff0000
rgb(r,g,b) rgb(255,0,0)
rgb(100%, 0%, 0%)

"Color" keyword format
SVG accepts an extensive list of color name keywords, for example "red".

The list of keywords as well as their RGB correspondence is found in Appendix A, Table of colors. You can also view this list and insert the color values directly via the 4D SVG Color palette. For more information about this point, please refer to the Development tools section.

Opacity

It is possible to specify the opacity in the color expressions of the component commands by using the syntax "color:opacity" where opacity is a number included between 0 (no color) and 100 (color completely opaque. So "red:50" will be interpreted as a red at 50% opacity.

Gradients

Gradients are progressive transitions of color along a vector. These gradients are set with the SVG_Define_linear_gradient and SVG_Define_radial_gradient commands. Once set, the gradients are used by reference using the "url(#GradientName)" syntax.

Similarly, it is possible to set a custom color associated with an opacity using the SVG_Define_solidColor command.