Component Preview
All visual components at a glance.
Card Previews
Schematic flow diagrams for product cards.
RoutingPreview
Decorative Backgrounds
Canvas and SVG backgrounds for sections and heroes.
NetworkMesh
FlickeringGrid
DottedMap
OrbitingCircles
GlowingStars
Card title here
Hover to see the wave effect.
BackgroundBeams
Vortex
Payment Method Icons
Brandfetch logos from PaymentMethodIcon component.
apple-pay
google-pay
paypal
klarna
affirm
afterpay
paypal-pay-in-4
zip
sezzle
zelle
venmo
pix
ideal
amazon-pay
cash-app-pay
samsung-wallet
shop-pay
Product Mockups
Detailed dashboard-style mockups for product pages.
RoutingMockup
CostOptimizationMockup
PaymentFormMockup
Payment Form
Card number
Expiry
CVC
Cardholder name
PaymentLinkMockup
Payment Link
Share link
AcquiringMockup
Acquiring
Worldpay
EU · GBP, EUR
$1.2M
99.3%
First Data
US · USD
$890K
99.1%
Adyen
APAC · Multi
$340K
97.8%
Stripe
NA · USD, CAD
$2.1M
99.7%
Checkout.com
EU · EUR
$560K
98.9%
Braintree
Global · Multi
$410K
98.2%
dLocal
LATAM · BRL, MXN
$280K
97.5%
PayU
IN · INR
$190K
96.8%
ApmMockup
AntifraudMockup
Fraud Screening
Low Risk
Score 12 / 100
Signals
BillingMockup
Billing
Pro Plan
Monthly · Auto-renew
Invoices
ChargebackMockup
Chargeback Representation
Dispute #CB-4891
Visa ****4242 · $2,340.00
Reason: Product not received
Deadline: Mar 5, 2026
Evidence
PreventionAlertsMockup
Prevention Alerts
3Velocity spike detected
12 attempts from same IP in 2 min
2 min ago
BIN attack pattern
Sequential card numbers from Eastern EU
8 min ago
Chargeback threshold
Visa ratio at 0.85% (limit: 0.9%)
23 min ago
Fraud rate normalized
Back below 0.5% threshold
1 hr ago
TokenVaultMockup
Token Vault
24.8K
Stored tokens
PCI L1
Compliance
Recent tokens
tok_1x8Kj2...m4Qp
****4242
tok_9pLm3...hR7s
****8891
tok_4nWq7...xT2j
****1234
SubscriptionBillingMockup
Subscription Billing
HealthyMRR
$48.2K
▲ 8.3%
Active
1,247
▲ 34
Churn
2.1%
▼ 0.4%
Collection Rate
96.8%WebhooksMockup
Webhooks
Endpoint active
https://api.example.com/webhooks
BrandedCheckoutMockup
Checkout Theme
Brand color
Font
Corners
Dark mode
Preview
MultiMethodMockup
Choose payment method
PaymentMethodCheckout
Choose payment method
Use Case Mockups
Charts, graphs, and data views for use case timelines.
PricingTiersMockup
Subscription Plans
Starter
$29/mo
Growth
$79/mo
RetryRecoveryMockup
Smart Retries
$12.8K
Recovered
68%
Recovery rate
Retry log
GlobalCurrencyMockup
Currencies
USD
Americas
EUR
Europe
GBP
UK
JPY
Asia
BRL
LatAm
AUD
Oceania
ConversionFunnelMockup
Checkout Funnel
Last 30 days
60.8% overallAnalyticsDashboardMockup
Analytics Overview
Total Volume
$4.2M
+12.3%Auth Rate
94.3%
+2.1%Decline Rate
5.7%
-1.4%Avg Ticket
$127
+$37-day volume
RoutingRulesMockup
Routing Rules
LiveSupportMetricsMockup
Enterprise Support
Priority< 15m
Response time
99.99%
Uptime SLA
Your team
Sarah Mitchell
Account Manager
James Kim
Technical Lead
InvoiceMockup
Invoice
Invoice
#INV-2024-038
Items
UX Consulting
12 hrs @ $150/hr
Design System
Fixed scope
SplitPaymentMockup
Payment Split
Buyer payment
$100.00
Seller
$85
85%
Platform
$12
12%
Tax
$3
3%
OnboardingMockup
Seller Onboarding
Email verified
seller@store.com
Identity uploaded
Government ID
Bank account linked
Awaiting micro-deposit
Final review
Automated approval
ComplianceMockup
Compliance Status
All clearVerification
Regions
PaymentScheduleMockup
Payment Schedule
Website Redesign
Client: Acme Corp
$5,000
Milestones