---
title: "Interface: ISpine | Customer's Canvas On-Premises"
canonical: "https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/interfaces/ObjectModel.ISpine/"
---

# Interface: ISpine

> A structure holding spine settings.

## Remarks

For details, see the [Folding lines and spines](https://customerscanvas.com/dev/editors/iframe-api/product-definition/folding-lines-and-spines.html) topic.

## Example

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

## Extends

- [`IFoldingLine`](https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/interfaces/ObjectModel.IFoldingLine.md)

## Properties

### isVertical?

> `optional` **isVertical?**: `boolean`

If `true`, then the folding line is vertical, otherwise it is horizontal. The default value is `true`.

#### Inherited from

[`IFoldingLine`](https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/interfaces/ObjectModel.IFoldingLine.md).[`isVertical`](https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/interfaces/ObjectModel.IFoldingLine.md#isvertical)

***

### margin?

> `optional` **margin?**: `string`

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. The default value is `"50%"`.

#### Inherited from

[`IFoldingLine`](https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/interfaces/ObjectModel.IFoldingLine.md).[`margin`](https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/interfaces/ObjectModel.IFoldingLine.md#margin)

***

### bleed?

> `optional` **bleed?**: `number`

Defines offset for the folding line, in points, depending on its orientation. It is a top/bottom offset for the vertical line and a left/right offset for the horizontal line. The default value is `0`.

#### Inherited from

[`IFoldingLine`](https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/interfaces/ObjectModel.IFoldingLine.md).[`bleed`](https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/interfaces/ObjectModel.IFoldingLine.md#bleed)

***

### pen?

> `optional` **pen?**: `object`

Configures the outline of the folding line.

#### width?

> `optional` **width?**: `number`

Line width.

#### dashStep?

> `optional` **dashStep?**: `number`

A dash step, in pixels.

#### color?

> `optional` **color?**: `string`

The main color of the folding line.

#### altColor?

> `optional` **altColor?**: `string`

The alt color of the folding line.

#### Inherited from

[`IFoldingLine`](https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/interfaces/ObjectModel.IFoldingLine.md).[`pen`](https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/interfaces/ObjectModel.IFoldingLine.md#pen)

***

### width?

> `optional` **width?**: `number`

Spine width, in points.

***

### fillColor?

> `optional` **fillColor?**: `string`

Spine fill color.