\n\n```js\nrequestInitCardBrandingAnimation(opts): Promise\n```\n

\n\nFunction to render Visa or MasterCard branding animation\n\n### Parameters\n\n* opts: [CardBrandingRequest]()\n\n### Returns\n\nPromise ``\n\n### Errors\n\n* If `opts` is not valid or the animation process fails then throw [error code E022](../Errors/Error-list.md).\n\n\n## Examples\n\n### Visa\n\nDefine the animation container\n\n```html\n\n\n\n

\n\n\n```\n\n
\n\nCall the method with opts for Visa\n\n```js\nimport {\n requestInitCardBrandingAnimation,\n CardBrandingRequest\n} from \"@kushki/js-sdk/CardAnimation\";\n\nconst onRequestInitCardBrandingAnimation = async () => {\n try {\n const opts: CardBrandingRequest = {\n brand: \"visa\"\n color: \"blue\"\n constrained: true,\n sound: true,\n checkmark: \"checkmarkWithText\",\n checkmarkTextOption: \"complete\",\n languageCode: \"es\"\n };\n\n await requestInitCardBrandingAnimation(opts);\n // On Success, the animation displayed according the opts into the container defined in the html\n } catch (error: any) {\n // On Error, catch response, ex. {code:\"E022\", message: \"Error al generar animación\"}\n console.error(error.message);\n }\n };\n```\n\n### Mastercard\n\nDefine the animation container\n\n```html\n\n\n\n

\n\n\n```\n\n
\n\nCall the method with opts for Mastercard\n\n```js\nimport {\n requestInitCardBrandingAnimation,\n CardBrandingRequest\n} from \"@kushki/js-sdk/CardAnimation\";\n\nconst onRequestInitCardBrandingAnimation = async () => {\n try {\n const opts: CardBrandingRequest = {\n brand: \"mastercard\"\n type: \"animation-only\",\n background: \"white\",\n sonicCue: \"securedby\",\n };\n\n await requestInitCardBrandingAnimation(opts);\n // On Success, the animation displayed according the opts into the container defined in the html\n } catch (error: any) {\n // On Error, catch response, ex. {code:\"E022\", message: \"Error al generar animación\"}\n console.error(error.message);\n }\n };\n```\n\n\n","folderId","projectId",1169997,"createdAt","2026-02-02T22:10:20.000Z","updatedAt","2026-02-02T22:10:25.000Z","creatorId",818325,"editorId",[],"visibility","INHERITED","extraData",{"_1190":1191,"_1199":1200},"apiFieldList",[1192],{"_5":1180,"_180":1193,"_23":1194,"_1195":1181,"_1196":1197,"_1198":52},"updateAt","Last modified:","value","format","2026-02-02 22:10:25","hidden","dataSchemaDefinitions",{},"docsIdTypeData",{"_1203":1204,"_1205":1206,"_1176":1177,"_1207":1208,"_1209":1210,"_1211":1212,"_1213":118,"_1214":-7},"onlineType","APIDOC","onlineId",763643,"teamId",565179,"branchId",1163590,"visitType","customDomain","subdirectory","specialFileType","notification",[],"footerBanner",[],"projectSetting",{"_1221":1222,"_1115":1223,"_1243":1244,"_1245":1246,"_1247":1248,"_1255":1256},"auth",{},{"_1224":157,"_1225":157,"_1226":52,"_1227":157,"_1228":157,"_1229":1230,"_1231":1232,"_1237":1238},"enableJsonc","enableBigint","responseValidate","enableTestScenarioSetting","enableYAPICompatScript","isDefaultUrlEncoding",3,"publishedDocUrlRules",{"_1233":1234,"_1235":1236},"defaultRule","SLUGIFY_WITH_RESOURCE_KEY","resourceKeyStandard","NEW","folderShareExpandModeSettings",{"_1239":1240,"_1241":1242},"expandId",[],"mode","MANUAL","securityScheme",{},"mockSettings",{},"preProcessors",[1249],{"_1250":1251,"_1252":52,"_1135":52,"_1171":118,"_5":1253,"_177":1254},"executionTiming","prerequest","defaultEnable","customScript","fjsNQKuLUl84Qwve2hwCuiQRwsA0pVwy","postProcessors",[1257],{"_1250":1251,"_1252":52,"_1135":52,"_1171":118,"_5":1253,"_177":1258},"pl4KosYfWkvN1KFdm2aBEsJy1do2V07e","environments",{"_1261":-7,"_1262":1263,"_1264":1265},"selectedEnvironment","environmentList",[],"servers",[1266,1268,1271,1274,1277],{"_177":1147,"_23":1267},"Default Server",{"_177":1269,"_23":1267,"_210":1270},"1057304",1057304,{"_177":1272,"_23":1267,"_210":1273},"1057305",1057305,{"_177":1275,"_23":1267,"_210":1276},"1057307",1057307,{"_177":1278,"_23":1267,"_210":1038},"1057309","searchSettings",{"_5":1281,"_1282":1283,"_1284":1285,"_1286":1287,"_1288":1289,"_1290":1291,"_1292":1291,"_1293":1294,"_1295":1296,"_1297":1298},"ALGOLIA","appId","I18RHLNCXJ","searchApiKey","974c63bb4153f6fb2c04fc94f1e9d62c","indexName","kushki_api","algoliaDocSearchRebuiltAt","2026-02-11T20:55:48.797Z","algoliaRebuildStatus","REBUILT","localSearchRebuildStatus","localSearchRebuiltAt","2026-02-11T20:15:31.568Z","localSearchIndexDataURL","/api/v1/projects/1169997/docs-sites/763643/search-index-data/preview?path=%2Fapp%2Fprojects%2F1169997%2Fdocs-sites%2Ffb8ec1d52f74cc3fe0d7cdbbafa8fa9f%2Flocal-search-indexes%2Fapidog_search%2Fdata.json","localSearchIndexSettingsURL","/api/v1/projects/1169997/docs-sites/763643/search-index-data/preview?path=%2Fapp%2Fprojects%2F1169997%2Fdocs-sites%2Ffb8ec1d52f74cc3fe0d7cdbbafa8fa9f%2Flocal-search-indexes%2Fapidog_search%2Fsettings.json","versionSettings",[1301],{"_1209":1210,"_1302":52,"_23":1167,"_1303":1167,"_1259":1304},"isDefaultVersion","slug",{"_1305":1306,"_1307":176},"environmentIds",[],"defaultEnvironmentId","seoInfos",["M",1310,1311,1320,1321,1325,1326],"6113478:API_FOLDER",{"_177":1312,"_1313":203,"_1314":1315,"_1009":1316,"_31":118,"_24":118,"_28":118,"_1317":1318,"_1176":1177,"_1319":118},13564,"relatedId","relatedType","API_FOLDER","pe","metaSocial",{},"customMeta","6113479:API_FOLDER",{"_177":1322,"_1313":215,"_1314":1315,"_1009":1323,"_31":118,"_24":118,"_28":118,"_1317":1324,"_1176":1177,"_1319":118},13565,"ec",{},"6113480:API_FOLDER",{"_177":1327,"_1313":222,"_1314":1315,"_1009":1328,"_31":118,"_24":118,"_28":118,"_1317":1329,"_1176":1177,"_1319":118},13566,"cl",{},"itemPathPrefix",{"_1332":118,"_1333":118,"_1213":118,"_1334":157},"baseUrl","versionSlug","isSharedDocIndependentDomain","appEnvMap",{"_1337":130},"appBrowserExtensionAdapterKey","customCodes",{"_1340":1341,"_1342":118},"javascript","window.addEventListener('load', function () {\n // Crear el script dinámicamente (Pure JS)\n var script = document.createElement('script');\n script.src = \"https://widget.kapa.ai/kapa-widget.bundle.js\";\n script.async = true;\n \n // Configuración de Kapa.ai usando dataset (más limpio)\n script.dataset.websiteId = '12fc377e-cf7f-49ea-87b0-abdacc38c179';\n script.dataset.projectName = 'Kushki Docs AI';\n script.dataset.projectColor = '#114e89';\n script.dataset.projectLogo = 'https://cdn.brandfetch.io/idbxMsL41n/theme/dark/symbol.svg?c=1bxid64Mup7aczewSAYMXt=1669618254999';\n script.dataset.botProtectionMechanism = 'hcaptcha';\n script.dataset.modalOverrideOpenId = 'ask-ai-input';\n script.dataset.modalOverrideOpenClass = 'search-input';\n script.dataset.modalOpenByDefault = 'true';\n script.dataset.modalTitle = 'Kushki Docs AI Assistant';\n script.dataset.modalExampleQuestionsTitle = 'Try asking me...';\n script.dataset.modalDisclaimer = '**What is this?** A demo of [kapa.ai](https://kapa.ai) for Kushki Docs AI.';\n script.dataset.modalExampleQuestions = 'Where to find my subscriptionID?,How to create a recurring charge?';\n script.dataset.buttonTextColor = '#ffffff';\n\n // Insertar en el body\n document.body.appendChild(script);\n \n console.log(\"✅ Kapa.ai inyectado (Evento 'load' completado)\");\n});","compiledCss","primaryColorVariable",{"_1065":1345,"_1070":1346},"--ui-primary-color-hover: var(--ui-primary-5);--ui-primary-color-active: var(--ui-primary-7);--ui-picker-basic-cell-hover-with-range-color: #121716;--ui-picker-date-hover-range-border-color: #33433f;--ui-primary-base: rgba(96,124,118,1);--ui-primary-base-p: 96, 124, 118;--ui-primary-color-p: 96, 124, 118;--ui-primary-color: rgba(96,124,118,1);--ui-primary-10: #252e2c;--ui-primary-9: #374542;--ui-primary-8: #42534f;--ui-primary-7: #516762;--ui-primary-7-p: 81, 103, 98;--ui-primary-6: rgba(96,124,118,1);--ui-primary-6-p: 96, 124, 118;--ui-primary-5: #8a9f9a;--ui-primary-5-p: 138, 159, 154;--ui-primary-4: #b0bebb;--ui-primary-3: #cad3d1;--ui-primary-2: #dee4e2;--ui-primary-1: #ebeeee;--ui-primary-1-p: 235, 238, 238;--ui-primary-a: #f2f4f3;--ui-primary-b: #f8f9f9;--g-color-primary: rgba(96,124,118,1);--ui-btn-primary-color: #fff;--ui-lime-6-p: 160,217,17;--ui-orange-6-p: 250,140,22;--ui-yellow-6-p: 250,219,20;--ui-pink-6-p: 235,47,150;--ui-body-background: rgb(255, 255, 255);--theme-tars-item-active-bg: var(--ui-tree-node-selected-bg);--ifm-menu-color: var(--ui-text-color-sub);--ifm-menu-color-active: var(--ui-text-color-sub);--ifm-menu-color-background-hover: var(--ui-item-hover-bg);--theme-tars-border-color-split: var(--ui-border-color-split);","--ui-primary-color-hover: var(--ui-primary-7);--ui-primary-color-active: var(--ui-primary-5);--ui-picker-basic-cell-hover-with-range-color: #003428;--ui-picker-date-hover-range-border-color: #008063;--ui-primary-base: rgba(0,230,178,1);--ui-primary-base-p: 0, 230, 178;--ui-primary-color-p: 0, 230, 178;--ui-primary-color: rgba(0,230,178,1);--ui-primary-10: #d0f9e9;--ui-primary-9: #7beec7;--ui-primary-8: #8cf1cd;--ui-primary-7: #67ecc1;--ui-primary-7-p: 103, 236, 193;--ui-primary-6: rgba(0,230,178,1);--ui-primary-6-p: 0, 230, 178;--ui-primary-5: #2aa786;--ui-primary-5-p: 42, 167, 134;--ui-primary-4: #2d7463;--ui-primary-3: #2a544c;--ui-primary-2: #274441;--ui-primary-1: #212e31;--ui-primary-1-p: 33, 46, 49;--ui-primary-a: #1f272c;--ui-primary-b: #1d2027;--g-color-primary: rgba(0,230,178,1);--ui-btn-primary-color: #fff;--ui-lime-6-p: 160,217,17;--ui-orange-6-p: 250,140,22;--ui-yellow-6-p: 250,219,20;--ui-pink-6-p: 235,47,150;--ui-body-background: #1a1922;--theme-tars-item-active-bg: var(--ui-tree-node-selected-bg);--ifm-menu-color: var(--ui-text-color-sub);--ifm-menu-color-active: var(--ui-text-color-sub);--ifm-menu-color-background-hover: var(--ui-item-hover-bg);--theme-tars-border-color-split: var(--ui-border-color-split);","routes/_index/route","actionData","errors"]

requestInitCardBrandingAnimation method

Parameters#

Returns#

Errors#

Examples#

Visa#

Mastercard#

Parameters

Returns

Errors

Examples

Visa

Mastercard