Skip to main content

MONEI Components

MONEI Components is a set of rich, prebuilt Components that help you create your own checkout flows across desktop and mobile.

Components include features like:

  • Format Credit Card information automatically as it’s entered
  • Translate placeholders to your customer’s preferred language
  • Use responsive design to fit the width of your customer’s screen or mobile device
  • Customize the styling to match the look and feel of your checkout flow
  • Apple Pay, Google Pay, PayPal, Bizum Сomponents for easy integration into your checkout flow
  • All MONEI Components are available in JavaScript, ReactJS, Vue and Angular

Setup monei.js#

You need to include monei.js in your checkout page by either adding the script tag to the head of your HTML file, or by importing it from the monei-js module:

<script src="https://js.monei.com/v1/monei.js"></script>

Card Input Component#

The Card Input Component lets you collect card information all within one Component. It includes a dynamically-updating card brand icon as well as inputs for number, expiry and CVC.

Edit monei-card-input-js

Card Input Component is completely customizable. You can style it to match the look and feel of your site, providing a seamless checkout experience for your customers. It’s also possible to style various input states, for example when the input has focus.

To see all available MONEI Components check the API docummentation or our integration guides for individual payment methods.