Skip to main content

Introduction

Customize the Checkout Form according to your business model to offer the best possible shopping experience to your buyers.

Colors

  • The Web SDK allows you to customize the colors of the checkout form to match your website's color palette. You can set the main colors, background colors, button colors and other visual elements.

Fonts

  • If you want to use specific fonts for the payment form, the Web SDK allows you to define the font or fonts of your choice.

Sizes

  • You can adjust the size and layout of the payment form to fit the design of your website. The web SDK provides options to set the height, width and overall layout of the form (embedded only).

Themes

  • Change the color of the Form elements by adding the theme attribute to the appearance object.

  • Note that the value of the attribute must be a string and also one of the allowed values shown below:

  • Available themes:

red | lightred | green | purple | black | blue| lightgreen

For example:

const iziConfig = {
config: {
...,
appearance: {
theme: 'purple'
},
...
}
};

Creating new themes

info

You can create new themes basic or advanced where you can customize:- Buttons

  • Information fields
  • Transition elements such as spinners and progress bars.
  • Borders.
  • Shadows and more.
  • You can change the color of these elements by adding the customTheme attribute to the appearance object.