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

ISafetyLine Interface

A structure holding settings for a safety line. For details, see the Safety Lines topic.

// Defining the product.
var w = 720, h = 504; // in points (1 point = 1/72 inch)

var emptyProduct = {
    surfaces: [{
        width: w,
        height: h,
        printAreas: [{
            bounds: {
                x: 0,
                y: 0,
                width: w,
                height: h
            safetyLines: [{
                margin: 8.5,
                color: 'rgba(0,255,0,1)',
                borderRadius: "10",
                stepPx: 5,
                widthPx: 1,
                pdfBox: "Trim"


Optional altColor

altColor: string

The alternate color; a CSS-style color value. The default value is "rgba(0,0,0,1)".

Optional borderRadius

borderRadius: string

The definition of rounded corners in the CSS format. You can set up the radius in points, in percent, or through the width and height of ellipses. By default, the safety zone is not rounded.

Optional color

color: string

The main color; a CSS-style color value. The default value is "rgba(255,255,255,1)".

Optional margin

margin: number | IMarginHV | IMarginLTRB

The distance between the safety line and the print area bounds, in points. The default value is 10 pt.

Optional name

name: string

The name of the safety line.

Optional pdfBox

pdfBox: PdfBox

The rectangle to wich the hi-res outputs are cropped: to CropBox, TrimBox, or BleedBox. By default, resulting PDF images are not cropped. Customer's Canvas applies margins of the safety line to the corresponding PDF page box.

Optional stepPx

stepPx: number

The dash length in pixels; the safety line is always a dashed line. The default value is 10 px.

Optional widthPx

widthPx: number

The line width, in pixels. The default value is 1 px.