Skip to main content
The playground runs the real Connect widget on sample data. Change the brand colour, corner radius and which sections appear, click through the widget itself, and copy the embed code that reproduces what you built. It opens in its own tab, because a widget with a verification wizard and a withdrawal flow inside it needs more room than a documentation page has. Launch the playgroundPayout and pay-in, live, with the embed snippet
No access token is involved and nothing there moves money. The widget’s API calls are answered from sample data in your browser, so the balances, payment methods and history are invented.

What you can change

The controls mirror what the Connect settings screen itself offers, so anything you can set there you can try here first. Three of those toggles act on screens you only reach by clicking: showWithdrawHeader on the withdraw panel, showKycHeader and showKycSteps on the verification wizard. Turn one off, then walk into that screen, and you will see what it removes. The widget accepts a great deal more - per-colour overrides, typography, spacing, button and card styling, and per-label text. Those are real and documented in full on Embedding and customization, but nothing in the Connect dashboard sets them, so they are left out of the playground rather than implying a configuration screen that does not exist.

Two things that surprise people

Only the literal string false hides a section. showBalance=0 and showBalance=no both read as true. A radius outside 0-50 is discarded, not clamped. borderRadius=99 falls back to the 12px default rather than rendering at 50. There is no theme=auto. The value is accepted but resolves to the light palette. To follow the reader’s system or page theme, detect it yourself and set theme=light or theme=dark on the iframe URL.