Start free
Traveler elements Free on all three models

Your booking flow,
plus the visa step.

Elements are drop-in components for the page you already have. Requirements, checkout and status render inside your layout, in your brand. The traveler never leaves your site, and passport data never touches your servers.

Start free See it running
18 KB
gzipped, no dependencies
4 lines
to a working requirements check
PCI SAQ-A
payment runs in our iframe
confirmation.html 
<!-- your booking confirmation page -->
<div id="visa"></div>

<script src="https://js.simplevisa.com/v1"></script>
<script>
  const sv = SimpleVisa('pk_live_9f2a…');

  sv.mount('#visa', {
    element:     'requirements',
    nationality: 'FR',
    destination: 'KE',
    layover:     ['QA'],
    departure:   '2026-09-12',
    travellers:  1
  });
</script>
Try it

See it on one of your own pages.

A booking confirmation, mocked up with a partner brand from the studio. Pick an element; everything inside the dashed outline is rendered by the library, and the snippet under it is what you paste.

Element
nordwind.com/booking/NW-4471/confirmation
Nordwind Air My trips
Your trip is booked NW-4471
Departure
Paris CDG · 12 Sep, 10:40
Arrival
Nairobi NBO · 12 Sep, 22:15
Passenger
M. Laurent
#visa rendered by SimpleVisa Elements

Tell us about the trip

Requirements depend on every passport in the party and on every country you touch, including the ones you only change planes in.

Route
Layovers Doha, Qatar4h · airside✕ Leaving the airport? Tell us; transit rules change.
Travelers · 3
1AdultPassport of France
2AdultPassport of Morocco
3Child, 7Passport of France
Different passports get different answers. If someone holds two, pick the one they will travel on; you can add residence permits on the next step.
3 passports · 3 countries checked · free
Add a bag Choose seats Manage booking
the code for what you are looking at
sv.mount('#visa', {
  element:     'trip',
  display:     'inline',
  brand:       'nordwind',
  origin:      'FR',
  travellers:  [{ type: 'adult', nationality: 'FR' },
                { type: 'adult', nationality: 'MA' },
                { type: 'child', nationality: 'FR', age: 7 }],
  onComplete:  (order) => track('visa_purchased', order.total)
});
Catalogue

Seven elements. Use one or all of them.

Most partners start with trip and requirements on the confirmation page, and add checkout once they see the attach rate. Pass what your booking already knows and the questions disappear.

tripStart here

Everything the answer depends on

A visa answer is never just "passport plus destination". This element collects the full picture: origin, destination, every layover with its duration and whether the traveler leaves the airport, the dates, the reason for travel, and a passport for each person in the party, adults and children alike. It hands a clean payload to requirements.

Prefill any field from your booking and the traveler only has to confirm it.
requirementsMost used

What this trip needs

A grid of every traveler against every country on the route. Each cell is either a document with its fee and processing time, or a plain "nothing needed", and the slowest item is called out so the party knows what to start first.

One row per passport. One total, one payment.
checkout

Applicant form and payment

Passport scan, applicant details, card. Runs in our iframe, so card and passport data stay out of your stack entirely.

Emits onComplete with the order.
status

Where the application is

The same timeline the traveler sees on our site, inside your account area. Live, so your support team stops fielding "where is my visa" tickets.

Takes an order reference or an email.
document

The approved visa itself

Once the government answers, this element shows the document with its validity dates and a download of the actual PDF, plus print and wallet. No email hunt, no login to our site.

Signed links, live for 12 months.
badge

A one-line warning

Fits in a search result or a fare row: "Visa required · from $78". Opens the full element on click, in whichever display mode you set.

Renders nothing when no document is needed.
uploadBeta

Missing document requests

When our team needs a clearer passport scan, the traveler can send it from your page instead of an email thread.

Only renders when a request is open.

Need something else?

Elements sit on the same public API you can call directly. If your flow does not fit one of the seven, build it on the Requirements and Applications endpoints.

Read the API reference →
Theming

Elements wear a brand you already designed.

A brand holds the logo, colors, corner radius and typeface. You design it once in the console and name it here; the same brand can dress this mount, a hosted storefront, and the emails travelers get. An element needs a brand, not a storefront.

Pass brand: 'nordwind' to wear a saved brand.
Or override any token inline for a single mount, useful for dark sections.
Styles are scoped to the element. Nothing leaks into your page, nothing of yours leaks in.
Open the brand studio
inline override
sv.mount('#visa', {
  element: 'requirements',
  brand: {
    primary:   '#0B3B8C',
    secondary: '#F2B705',
    radius:    '2px',
    font:      'Archivo, sans-serif',
    logo:      'https://…/nordwind.svg'
  }
});
Reference

Mount options

elementtrip · requirements · checkout · status · document · badge · upload
displayinline (default), drawer or modal.
originWhere the trip starts. Used for transit and residence rules.
destinationWhere the traveler lands. Layovers go in their own array.
layoverArray of stops: { country, hours, airside }. Transit rules are answered explicitly.
travellersArray, one entry per passport: { type, nationality, age, residence }. Each gets its own answer.
nationalityShorthand for a single adult traveler. Ignored if travelers is set.
departureISO date. Drives validity windows and processing warnings.
purposetourism · business · study · transit. Changes which visa applies.
brandA brand key from the console, or an object of tokens to override.
locale22 languages. Defaults to the browser locale.
 

Events

onReadyElement mounted and sized. Use it to remove your own skeleton.
onRequirementsFires with the document list and total, before any purchase.
onCompletePayment succeeded. Carries order reference, total and currency.
onStatusChangeApplication moved a step. Also delivered as a webhook.
onErrorNetwork or validation failure, with a code you can log.
What never reaches your servers

Passport numbers, scans and card details are entered inside our iframe and posted straight to us. Your page receives the order reference, the status and the amount: enough to reconcile, nothing you have to protect.

Sandbox keys are instant.

Mount an element against test data today, switch the key when you are ready. No call needed to get started.

Talk to an engineer Start free