SDK Overview

Choose the right Yuno SDK integration for your checkout experience

Which integration should I use?

Our single SDK is very flexible and supports different patterns based on the level of control you need. More advanced use cases require a larger integration effort, so make sure your requirements justify the investment.

Not sure what to do? Go with Full Checkout. It covers the most common scenarios with the least integration effort.

Full Checkout (Recommended)

Full Checkout is the fastest path to accepting payments. Mount it with a single call and Yuno renders the entire checkout UI. Payment method selection, card forms, alternative methods, and 3DS handling. All included.

• Fastest time-to-value. One mount call, ~10 lines of code
• All payment methods render automatically based on your configuration
• SAQ-A compliance (simplest PCI level. Card data never touches your servers)
• Production-ready. Responsive, accessible, localized out of the box

Get started with the Full Checkout integration guide.

Need more control? Compare all integration patterns

Comparison

	Full	Seamless	Lite	Secure Fields	Headless
Best for	Most integrations	Custom method selection	Custom checkout pages	Individual field styling	Full UI control
Effort	~10 lines	Low	Medium	Medium-High	High
UI control	Theme & branding	Payment method list	Layout + styling	Per-field styling	Complete
PCI scope	SAQ-A	SAQ-A	SAQ-A	SAQ-A	SAQ-A
Payment methods	All, automatic	All, you select	All, you select	Cards only	Cards only
Auto payment methods	Yes	Yes	No	No	No
Dashboard conditions	Yes	Yes	Yes	Yes	No

Seamless Checkout

Seamless Checkout combines SDK convenience with control over payment method selection. Yuno handles the payment form and creates payments in a single flow. You control which methods to show and when.

• Single-flow payment creation. The only integration that handles token-to-payment seamlessly
• Payment method control. You decide which methods to display
• External buttons. Mount Apple Pay and Google Pay buttons anywhere in your UI
• Low development effort. Similar to Full Checkout with more flexibility

Get started with the Seamless Checkout integration guide.

Lite Checkout

Embed a payment form directly in your page with full layout control. Yuno supplies available payment methods; you decide which to display and manage the UI.

See the Lite Checkout guide.

Secure Fields

Individual, tokenized input fields (card number, expiry, CVV) that you place and style independently. Web only.

See the Secure Fields guide.

Headless

Build your own checkout UI from scratch. You collect card data, Yuno handles tokenization and 3DS. Maximum flexibility, highest integration effort.

See the Headless guide.

Installation

Install the Yuno Web SDK via npm or CDN:

npm

npm install @yuno-payments/sdk-web

SDK Versions

When integrating, always check the latest version of @yuno-payments/sdk-web on npm to ensure compatibility.

If you are upgrading from a previous SDK version, check the changelog for breaking changes in the initialization API.

Next Steps

Full Checkout

Recommended. Get live in minutes.

Customization

Theme, branding, and styling options.

Next Steps

Recommended progression:

1. Full Checkout. Start here. Pre-built UI with all payment methods.
2. Customize the UI. Match the checkout to your brand.
3. Add card enrollment. Let customers save cards for future payments.
4. Explore advanced modes. Seamless, Lite, Secure Fields, and Headless for more control.