Skip to content
Payment Emulator LabDocumentationOpen console

Providers and icons

Provider icon assets

The source SVGs are supplied alongside the provider documentation. They arebundled locally in each independent frontend; payment pages need no icon CDN.

2 min read

Índice / Index · Español

The source SVGs are supplied alongside the provider documentation. They are bundled locally in each independent frontend; payment pages need no icon CDN.

Provider Source under llms/ Iconify identifier
Mercado Pago mercado-pago/thesvg-color--mercado-pago.svg thesvg-color:mercado-pago
PayPal paypal/thesvg-color--paypal.svg thesvg-color:paypal
Stripe stripe/selfhst--stripe.svg selfhst:stripe

For a new gateway, first check its llms directory. Otherwise open Iconify thesvg-color and use the page's keyword search with the gateway name. If it is absent, try recognizable aliases, alternate spelling or a descriptive related name. Inspect the result to confirm its identity and the source's license/attribution. An unrelated brand is never an acceptable fallback: use a neutral payment icon and the visible provider name when no suitable mark is found.

Save the source with its collection and icon name beside the llms file. Copy it to apps/checkout/providers/<id>/logo.svg and apps/console/app/assets/images/gateways/<id>.svg; register the console asset in GatewayIdentity.vue and import the checkout asset in the provider kit. No application imports source from the other application.

Keep original SVG colors and proportions. The console uses a neutral white surface so colored marks remain legible in light and dark themes. Names remain visible, decorative images use alt="", and icons add no tab stops. Unknown providers retain a neutral icon and their name. Check the selector, cards, tables and buyer page at mobile width after adding a mark.

Payment Emulator Lab · RonuSoftwareMIT