Vue Stripe Playground
Vue Stripe Playground
Interactive demos for testing Vue Stripe components and integrations
Backend Required
Most demos require a clientSecret or sessionId from your backend.
Use our data generator to create test secrets: backend.vuestripe.com
Add Your Stripe Key
Click "Add Stripe Key" in the header to enter your test publishable key.
Get your key from Stripe Dashboard
Payment Components
Recommended
Payment Element
Accept cards, wallets, and bank payments with one component
Card Element
Classic single-line card input
Express Checkout
Apple Pay, Google Pay, Link buttons
Stripe Checkout
Embedded Stripe-hosted checkout
Setup Intent
Save payment methods for later
Address Element
Collect shipping & billing addresses
Link Authentication
Enable Stripe Link for faster checkout
Split Card Elements
Separate number, expiry, CVC inputs