By default, there are named colors called blue, orange, green, red, purple, brown, magenta, grey or gray, and olive. These correspond to the colors in d3.schemeCategory10. Circle A below is colored this way.
Because d3 is available, you can access other d3 color functions; for example, circle B uses the purple in the d3.schemeDark2 palette.
You can specify a hex color code (as in circle C) and RGB color code (as in circle D); however, notice that the hex codes need to be wrapped in double quotes and then single quotes in order to be read properly!
You can specify names of colors in the colors attribute and use them for multiple objects:
Some objects can have both a stroke color (for lines/curves) and a fill color (to fill an area). If you just use color as an attribute, it will use that color for both of these. However, if you want a different color for the stroke and fill, you need to specify them separately:
Note that each shape type has a default color (points and circles are blue, lines are orange, etc.) so that they show up even if you don’t specify a color.
Besides colors, strokes can have different attributes:
strokeWidth sets the thickness of the stroke (in pixels); the default is 1lineStyle sets the style of drawing to solid (the default), dashed, or dottedBesides colors, fills can also have different attributes:
opacity determines how transparent a fill is; by default, it is set to 0.2 (20%)fillPattern