---
updatedAt: 2025-05-20T21:54:19.000Z
agentTools:
  projectIndex: https://shop-and-pay.readme.io/llms.txt
---

# Create a Design

**Note for NodeJS**: You need to install the following modules:\
*npm i axios crypto-js qs*

# OpenAPI definition

```json
{
  "openapi": "3.1.0",
  "info": {
    "title": "api-settings",
    "version": "1.0"
  },
  "servers": [
    {
      "url": "https://api.shop-and-pay.com/v1.0"
    }
  ],
  "security": [
    {}
  ],
  "paths": {
    "/Design/": {
      "post": {
        "summary": "Create a Design",
        "description": "",
        "operationId": "create-a-design",
        "parameters": [
          {
            "name": "instance",
            "in": "query",
            "description": "Your Shop & Pay instance name",
            "required": true,
            "schema": {
              "type": "string"
            }
          }
        ],
        "requestBody": {
          "content": {
            "application/x-www-form-urlencoded": {
              "schema": {
                "type": "object",
                "required": [
                  "name"
                ],
                "properties": {
                  "name": {
                    "type": "string",
                    "description": "Name of the design"
                  },
                  "default": {
                    "type": "integer",
                    "description": "Set to 1 if design should be default design. Set to 0 otherwise.",
                    "default": 0,
                    "format": "int32"
                  },
                  "fontFamily": {
                    "type": "string",
                    "description": "Arial, Courier New, Georgia, Open Sans, Times New Roman or Verdana"
                  },
                  "fontSize": {
                    "type": "integer",
                    "description": "In pixel",
                    "format": "int32"
                  },
                  "textColor": {
                    "type": "string",
                    "description": "Hex code without #"
                  },
                  "textColorVPOS": {
                    "type": "string",
                    "description": "Hex code without #"
                  },
                  "linkColor": {
                    "type": "string",
                    "description": "Hex code without #"
                  },
                  "linkHoverColor": {
                    "type": "string",
                    "description": "Hex code without #"
                  },
                  "buttonColor": {
                    "type": "string",
                    "description": "Hex code without #"
                  },
                  "buttonHoverColor": {
                    "type": "string",
                    "description": "Hex code without #"
                  },
                  "background": {
                    "type": "string",
                    "description": "color or image"
                  },
                  "backgroundColor": {
                    "type": "string",
                    "description": "Hex code without #"
                  },
                  "headerBackground": {
                    "type": "string",
                    "description": "color or image"
                  },
                  "headerBackgroundColor": {
                    "type": "string",
                    "description": "Hex code without #"
                  },
                  "emailHeaderBackgroundColor": {
                    "type": "string",
                    "description": "Hex code without #"
                  },
                  "headerImageShape": {
                    "type": "string",
                    "description": "square, rectangular or round"
                  },
                  "useIndividualEmailLogo": {
                    "type": "integer",
                    "description": "0 or 1",
                    "format": "int32"
                  },
                  "logoBackgroundColor": {
                    "type": "string",
                    "description": "Hex code without #"
                  },
                  "logoBorderColor": {
                    "type": "string",
                    "description": "Hex code without #"
                  },
                  "VPOSGradientColor1": {
                    "type": "string",
                    "description": "Hex code without #"
                  },
                  "VPOSGradientColor2": {
                    "type": "string",
                    "description": "Hex code without #"
                  },
                  "enableRoundedCorners": {
                    "type": "integer",
                    "description": "0 or 1",
                    "format": "int32"
                  },
                  "VPOSBackground": {
                    "type": "string",
                    "description": "color or image"
                  },
                  "headerImage": {
                    "type": "object",
                    "description": "CURLFile object",
                    "properties": {}
                  },
                  "backgroundImage": {
                    "type": "object",
                    "description": "CURLFile object",
                    "properties": {}
                  },
                  "headerBackgroundImage": {
                    "type": "object",
                    "description": "CURLFile object",
                    "properties": {}
                  },
                  "emailHeaderImage": {
                    "type": "object",
                    "description": "CURLFile object",
                    "properties": {}
                  },
                  "VPOSBackgroundImage": {
                    "type": "object",
                    "description": "CURLFile object",
                    "properties": {}
                  }
                }
              }
            }
          }
        },
        "responses": {
          "200": {
            "description": "200",
            "content": {
              "application/json": {
                "examples": {
                  "Raw": {
                    "value": "{  \n    \"status\":\"success\",\n    \"data\":[  \n        {  \n            \"uuid\":\"f45aff72\",\n            \"default\":0,\n            \"name\":\"Example Design (via API)\",\n            \"fontFamily\":\"Arial\",\n            \"fontSize\":\"14\",\n            \"textColor\":\"24363A\",\n            \"textColorVPOS\":\"24363a\",\n            \"linkColor\":\"0074D6\",\n            \"linkHoverColor\":\"2A6496\",\n            \"buttonColor\":\"99CC33\",\n            \"buttonHoverColor\":\"19B8F2\",\n            \"background\":\"color\",\n            \"backgroundColor\":\"F9FAFA\",\n            \"headerBackground\":\"color\",\n            \"headerBackgroundColor\":\"00AFF0\",\n            \"emailHeaderBackgroundColor\":\"FAFAFA\",\n            \"headerImageShape\":\"square\",\n            \"useIndividualEmailLogo\":0,\n            \"logoBackgroundColor\":\"FFFFFF\",\n            \"logoBorderColor\":\"DDDDDD\",\n            \"VPOSGradientColor1\":\"00AFF0\",\n            \"VPOSGradientColor2\":\"00AFF0\",\n            \"enableRoundedCorners\":1,\n            \"headerImage\":\"shopandpay-logo.png\",\n            \"backgroundImage\":\"\",\n            \"headerBackgroundImage\":\"\",\n            \"emailHeaderImage\":\"\"\n        }\n    ]\n}"
                  }
                },
                "schema": {
                  "type": "object",
                  "properties": {
                    "status": {
                      "type": "string",
                      "example": "success"
                    },
                    "data": {
                      "type": "array",
                      "items": {
                        "type": "object",
                        "properties": {
                          "uuid": {
                            "type": "string",
                            "example": "f45aff72"
                          },
                          "default": {
                            "type": "integer",
                            "example": 0,
                            "default": 0
                          },
                          "name": {
                            "type": "string",
                            "example": "Example Design (via API)"
                          },
                          "fontFamily": {
                            "type": "string",
                            "example": "Arial"
                          },
                          "fontSize": {
                            "type": "string",
                            "example": "14"
                          },
                          "textColor": {
                            "type": "string",
                            "example": "24363A"
                          },
                          "textColorVPOS": {
                            "type": "string",
                            "example": "24363a"
                          },
                          "linkColor": {
                            "type": "string",
                            "example": "0074D6"
                          },
                          "linkHoverColor": {
                            "type": "string",
                            "example": "2A6496"
                          },
                          "buttonColor": {
                            "type": "string",
                            "example": "99CC33"
                          },
                          "buttonHoverColor": {
                            "type": "string",
                            "example": "19B8F2"
                          },
                          "background": {
                            "type": "string",
                            "example": "color"
                          },
                          "backgroundColor": {
                            "type": "string",
                            "example": "F9FAFA"
                          },
                          "headerBackground": {
                            "type": "string",
                            "example": "color"
                          },
                          "headerBackgroundColor": {
                            "type": "string",
                            "example": "00AFF0"
                          },
                          "emailHeaderBackgroundColor": {
                            "type": "string",
                            "example": "FAFAFA"
                          },
                          "headerImageShape": {
                            "type": "string",
                            "example": "square"
                          },
                          "useIndividualEmailLogo": {
                            "type": "integer",
                            "example": 0,
                            "default": 0
                          },
                          "logoBackgroundColor": {
                            "type": "string",
                            "example": "FFFFFF"
                          },
                          "logoBorderColor": {
                            "type": "string",
                            "example": "DDDDDD"
                          },
                          "VPOSGradientColor1": {
                            "type": "string",
                            "example": "00AFF0"
                          },
                          "VPOSGradientColor2": {
                            "type": "string",
                            "example": "00AFF0"
                          },
                          "enableRoundedCorners": {
                            "type": "integer",
                            "example": 1,
                            "default": 0
                          },
                          "headerImage": {
                            "type": "string",
                            "example": "shopandpay-logo.png"
                          },
                          "backgroundImage": {
                            "type": "string",
                            "example": ""
                          },
                          "headerBackgroundImage": {
                            "type": "string",
                            "example": ""
                          },
                          "emailHeaderImage": {
                            "type": "string",
                            "example": ""
                          }
                        }
                      }
                    }
                  }
                }
              }
            }
          }
        },
        "deprecated": false,
        "x-readme": {
          "code-samples": [
            {
              "language": "php",
              "code": "<?php\n\nuse Shopandpay\\Models\\Request\\Design;\nuse Shopandpay\\Shopandpay;\nuse Shopandpay\\ShopandpayException;\n\nspl_autoload_register(function ($class) {\n    $root = dirname(__DIR__);\n    $classFile = $root . '/lib/' . str_replace('\\\\', '/', $class) . '.php';\n    if (file_exists($classFile)) {\n        require_once $classFile;\n    }\n});\n\n// $instanceName is a part of the url where you access your shopandpay installation.\n// https://{$instanceName}.shop-and-pay.com\n$instanceName = 'YOUR_INSTANCE_NAME';\n\n// $secret is the shopandpay secret for the communication between the applications\n// if you think someone got your secret, just regenerate it in the shopandpay administration\n$secret = 'YOUR_SECRET';\n\n$shopandpay = new Shopandpay($instanceName, $secret);\n\n$design = new Design();\n$design->setDefault(false);\n$design->setName('Example Design (via API)');\n$design->setHeaderImageShape('square'); // square, rectangular or round\n$design->setLogoBackgroundColor('FFFFFF'); // Hex code\n$design->setLogoBorderColor('DDDDDD'); // Hex code\n$design->setBackground('color'); // color or image\n$design->setBackgroundColor('F9FAFA'); // Hex code\n$design->setHeaderBackground('color'); // color or image\n$design->setHeaderBackgroundColor('00AFF0'); // Hex code\n$design->setVPOSGradientColor1('00AFF0'); // Hex code\n$design->setVPOSGradientColor2('00AFF0'); // Hex code\n$design->setFontFamily('Arial');\n$design->setFontSize('14'); // In pixel\n$design->setTextColor('24363A'); // Hex code\n$design->setTextColorVPOS('24363A'); // Hex code\n$design->setLinkColor('0074D6'); // Hex code\n$design->setLinkHoverColor('2A6496'); // Hex code\n$design->setButtonColor('99CC33'); // Hex code\n$design->setButtonHoverColor('19B8F2'); // Hex code\n$design->setEnableRoundedCorners(true);\n$design->setUseIndividualEmailLogo(false);\n$design->setEmailHeaderBackgroundColor('FAFAFA'); // Hex code\n\n$design->setHeaderImage(new CURLFile(__DIR__ . '/shopandpay-logo.png'));\n\ntry {\n    $response = $shopandpay->create($design);\n    var_dump($response);\n} catch (ShopandpayException $e) {\n    print $e->getMessage();\n}\n"
            }
          ],
          "samples-languages": [
            "php"
          ]
        }
      }
    }
  },
  "x-readme": {
    "headers": [],
    "explorer-enabled": false,
    "proxy-enabled": true
  },
  "x-readme-fauxas": true
}
```