Skip to main content

Gateway appearances

Payment gateway can have custom colors and logo.

Color guide

warning

Gateway appearances can be change only in PRODUCTION mode.

const { response } = await sdk.setAppearancesLogo({
  logoImage:
    "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAIAQMAAAD+wSzIAAAABlBMVEX///+/v7+jQ3Y5AAAADklEQVQI12P4AIX8EAgALgAD/aNpbtEAAAAASUVORK5CYII",
});
if (response.status === 201) {
  console.log("Logo was successfully saved.");
}

Colors​

const { response } = await sdk.setAppearances({
  theme: "SYSTEM",
  surfaceAccent: {
    colorDarkMode: "#ff0000", //🟥
    colorLightMode: "#ff0000",
  },
  tintAccent: {
    colorDarkMode: "#00ff00 ", //🟩
    colorLightMode: "#00ff00",
  },
  tintOnAccent: {
    colorDarkMode: "#0000ff", //🟦
    colorLightMode: "#0000ff",
  },
});
if (response.status === 201) {
  console.log("Logo was successfully saved.");
}
tip

Changes are reflected only in new payments. Refresh of page is not sufficient.