The pergola.pattern library object defines pattern methods. Pattern elements are not created at runtime The function creates the pattern with unique ID based on parameters–if it doesn't exist–and returns the URI string.

View as standalone SVG

All pattern definitions have colors, width, height, opacity and transform properties, and some also have size, spacing and "stroke-width", where applicable.

The examples above were obtained by simply fiddling around with values. Overriding the width and/or height can produce dramatic deviations from the original design, while playing with transformations can be more interesting. For some of the types, overridden width and height are ignored. Learn more in the PATTERNS library section of the Tutorial.


To use a pattern assign the call to the fill and, or stroke properties of an element:

catseye #1

pirelli #6

bar #3

checkers #2

hive #3

ring #5