This is an old documentation. Go to the latest Customer's Canvas docs

ISpine Interface

A structure holding spine settings. For details, see the Folding Lines and Spines topic.

const productDefinition = { 
    surfaces: [{ 
        spines: [{
            isVertical: false,
            width: 20,
            bleed: 10,
            pen: {
                color: "green"
            fillColor: "lightGreen" 
        printAreas: [{ 
            designFile: "book"


Optional bleed

bleed: number

bleed sets offset in points for the folding line depending on its orientation. It is a top/bottom offset for the vertical line and a left/right offset for the horizontal line.

Optional fillColor

fillColor: string

spine fill color.

Optional isVertical

isVertical: boolean

defines whether the folding line is vertical. If true, then the line is vertical, otherwise it is horizontal.

Optional margin

margin: string

margin defines the absolute or relative location of the folding line on the product in points or percent. For vertical lines, it defines the x-axis offset from the left edge. For horizontal lines, it defines the y-axis offset from the top edge of the product. To set the relative offset in percent, add the percent sign to the number.

Optional pen

pen: object

pen configures the outline of the folding line.

pen declaration

  • Optional altColor: string

    line alt color

  • Optional color: string

    line main color

  • Optional dashStep: number

    line dash step in pixels

  • Optional width: number

    line width

Optional width

width: number

spine width in points.