# Customizing Data Connect source: https://developer.mastercard.com/open-finance-us/documentation/connect/configure-connect-experience/customize-connect/index.md Customize Data Connect enables you to tailor the appearance and behavior of the Data Connect application's interface to suit your branding and user experience requirements. You can enable or disable features and filter account types, allowing you to streamline the experience to focus on essential elements for your application. This customization improves the overall user experience by aligning the application with your customers' preferences. After your experience is configured on Customize Data Connect, an experience ID is created that you can pass in the `experience` parameter when [generating a Data Connect URL](https://developer.mastercard.com/open-finance-us/documentation/connect/generate-2-connect-url-apis/index.md). The generated URL will then load your customized version of the Data Connect experience. ## Step 1: Access Customize Data Connect on Client Hub {#step-1-access-customize-data-connect-on-client-hub} 1. **Log in** to your [Mastercard Developers account](https://developer.mastercard.com/account/log-in). 2. **Access your Open Finance project**: * If you already have an Open Finance project, proceed to step 3 * If you do not have an Open Finance project yet, you will need to [create a new project](https://developer.mastercard.com/open-finance-us/documentation/quick-start-guide/index.md#create-a-sandbox-project) 3. **Access Client Hub**: * To access [Client Hub](https://developer.mastercard.com/open-finance-us/documentation/client-hub-guide/accessing-client-hub/index.md) in a test environment: * Go to the Sandbox credentials section in your project * Click the overflow menu (three dots), then click **Access Client Hub** to open the Client Hub application * To access Client Hub in a production environment: * Go to the Production credentials section in your project * Click the overflow menu (three dots), then click **Access Client Hub** to open the Client Hub application 4. **Navigate to Customize Connect**: * On Client Hub, navigate to **Customize Connect** ![](https://static.developer.mastercard.com/content/open-finance-us/uploads/clienthub-customizeconnect.png) ## Step 2: Create or Modify a Data Connect Experience {#step-2-create-or-modify-a-data-connect-experience} * To create a new experience, click **Add New** and provide an Experience Name. * To modify an existing experience, click the experience and start editing. Note: **Auto Save**: When customizing the Data Connect experiences, your changes are automatically saved. The auto-save functionality ensures that any adjustments you make are instantly applied and retained without needing to manually save your work. ## Step 3: Configure the Data Connect Experience {#step-3-configure-the-data-connect-experience} The following are the key aspects of Data Connect you can customize: ### Product Type {#product-type} The Product Type drop-down list allows you to select the product for which you want to customize the Data Connect Experience. The drop-down will display only the products that are available to your organization based on your existing contract. If a specific product type does not appear in the list, it may mean that it is not currently included in your contract or was unintentionally omitted. If you have questions about product availability, reach out to your Customer Success Manager (CSM), who can ensure the drop-down reflects the products available to you. Once you've selected the appropriate product type, click **Create** to proceed with customizing your Data Connect Experience. ![](https://static.developer.mastercard.com/content/open-finance-us/uploads/create_new_connect_experience_1.png) ### Configure Landing Page {#configure-landing-page} You can customize the landing page that users see at the start of the experience. * Provide your company name. It appears as: "\[Company Name\] uses Finicity, a Mastercard company..." This field is prepopulated from your company profile. Check it and edit if needed. * Select the text of the Call To Action (CTA) button that users must click to proceed to the next step. * Click **\>** to move to the next screen. ![](https://static.developer.mastercard.com/content/open-finance-us/uploads/company_name_customize_connect_2.png) ### Financial Institutions {#financial-institutions} This page enables you to personalize the screen where users can search and choose from a list of available Financial Institutions (FIs). You can customize how the institutions are displayed, such as by prioritizing certain FIs or changing the appearance of the list. Mastercard recommends using the **Automatic (recommended)** option, which displays the default list of Financial Institutions based on user data. You can drag the Financial Institution tiles to reorder your top 8 FIs. ![](https://static.developer.mastercard.com/content/open-finance-us/uploads/recommended_FI_list_1.png) If you want to add an FI that's not featured in the recommended list, you can do so by specifying the financial institutions in the **Find a bank to feature** search box. ![](https://static.developer.mastercard.com/content/open-finance-us/uploads/search_FI_not_featured.png) ### Account Selection {#account-selection} You can customize the screen where your customers are required to select specific accounts they want to link with your application. #### Number of Accounts {#number-of-accounts} This option allows you to configure whether the end user will be able to select and link only a single account (radio button UI) or select and link multiple accounts (checkbox UI). ![](https://static.developer.mastercard.com/content/open-finance-us/uploads/single_multiple_accounts_1.png) #### Available Account Types {#available-account-types} You can customize which account types are available for users to select. This can be useful if your application requires users to connect specific types of accounts, such as checking accounts for banking apps or investment accounts for financial planning tools. ![](https://static.developer.mastercard.com/content/open-finance-us/uploads/account_type_selection_1.png) If the **Use recommended accounts** option is checked, the following account types will be selected by default, based on the product type you selected in the [Create new experience](https://developer.mastercard.com/open-finance-us/documentation/connect/configure-connect-experience/customize-connect/index.md#step-2-create-or-modify-a-data-connect-experience) dialog: | # | Product Type | Account Types | |----|------------------------------|---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------| | 1 | Aggregation | All account types are selected. | | 2 | Asset Summary | Checking, Savings, Money Market, CD, Unknown, Investment, Investment Tax Deferred, Employee Stock Purchase Plan, IRA, 401k, Roth, 403b, Rollover, Keogh, 457, 401a, Brokerage Account, Education Savings, Non Taxable Brokerage Account, Pension, Roth 401k, SEP IRA, Simple IRA, Thrift Savings Plan, Health Savings Account, Profit Sharing Plan, Variable Annuity | | 3 | Cash Flow Business | All account types are selected. | | 4 | Cash Flow Personal | All account types are selected. | | 5 | DCR | Checking, Savings, Money Market | | 6 | History | Checking, Savings, Money Market, CD, Unknown, Investment, Investment Tax Deferred, Employee Stock Purchase Plan, IRA, 401k, Roth, 403b, Rollover, Keogh, 457, 401a, Brokerage Account, Education Savings, Non Taxable Brokerage Account, Pension, Roth 401k, SEP IRA, Simple IRA, Thrift Savings Plan, Health Savings Account, Profit Sharing Plan, Variable Annuity | | 7 | MVS Basic | Checking, Savings, Money Market, CD, Unknown, Investment, Investment Tax Deferred, Employee Stock Purchase Plan, IRA, 401k, Roth, 403b, Rollover, Keogh, 457, 401a, Brokerage Account, Education Savings, Non Taxable Brokerage Account, Pension, Roth 401k, SEP IRA, Simple IRA, Thrift Savings Plan, Health Savings Account, Profit Sharing Plan, Variable Annuity | | 8 | MVS Basic Paystub | Checking, Savings, Money Market, CD, Unknown, Investment, Investment Tax Deferred, Employee Stock Purchase Plan, IRA, 401k, Roth, 403b, Rollover, Keogh, 457, 401a, Brokerage Account, Education Savings, Non Taxable Brokerage Account, Pension, Roth 401k, SEP IRA, Simple IRA, Thrift Savings Plan, Health Savings Account, Profit Sharing Plan, Variable Annuity | | 9 | MVS Full | Checking, Savings, Money Market, CD, Unknown, Investment, Investment Tax Deferred, Employee Stock Purchase Plan, IRA, 401k, Roth, 403b, Rollover, Keogh, 457, 401a, Brokerage Account, Education Savings, Non Taxable Brokerage Account, Pension, Roth 401k, SEP IRA, Simple IRA, Thrift Savings Plan, Health Savings Account, Profit Sharing Plan, Variable Annuity | | 10 | MVS IE | Checking, Savings, Money Market | | 11 | MVS IE Basic | Checking, Savings, Money Market | | 12 | Pre Qual VOA | Checking, Savings, Money Market, CD, Unknown, Investment, Investment Tax Deferred, Employee Stock Purchase Plan, IRA, 401k, Roth, 403b, Rollover, Keogh, 457, 401a, Brokerage Account, Education Savings, Non Taxable Brokerage Account, Pension, Roth 401k, SEP IRA, Simple IRA, Thrift Savings Plan, Health Savings Account, Profit Sharing Plan, Variable Annuity | | 13 | Ultrafico | Checking, Savings, Money Market | | 14 | VOA | Checking, Savings, Money Market, CD, Unknown, UGMA, UTMA, 529, Investment, Investment Tax Deferred, Employee Stock Purchase Plan, IRA, 401k, Roth, 403b, Rollover, Keogh, 457, 401a, Brokerage Account, Education Savings, Non Taxable Brokerage Account, Pension, Roth 401k, SEP IRA, Simple IRA, Thrift Savings Plan, Health Savings Account, Profit Sharing Plan, Variable Annuity | | 15 | VOE Payroll | All account types are selected. | | 16 | VOE Transactions | Checking, Savings, Money Market, CD, Unknown, Investment, Investment Tax Deferred, Employee Stock Purchase Plan, IRA, 401k, Roth, 403b, Rollover, Keogh, 457, 401a, Brokerage Account, Education Savings, Non Taxable Brokerage Account, Pension, Roth 401k, SEP IRA, Simple IRA, Thrift Savings Plan, Health Savings Account, Profit Sharing Plan, Variable Annuity | | 17 | VOI | Checking, Savings, Money Market | | 18 | VOIE Payroll | All account types are selected. | | 19 | VOIE Paystub | All account types are selected. | | 20 | VOIE Paystub Tx Verify | Checking, Savings, Money Market | | 21 | Transactions CRA | All account types are selected. | | 22 | VOI Transactions CRA | All account types are selected. | | 23 | ACH | Checking, Savings, CD, Money Market (Only Visible When Product Is ACH) | | 24 | Balance Analytics Personal | Checking, Savings, Money Market, CD, Unknown, Investment, Investment Tax Deferred, Employee Stock Purchase Plan, IRA, 401k, Roth, 403b, Rollover, Keogh, 457, 401a, Brokerage Account, Education Savings, Non Taxable Brokerage Account, Pension, Roth 401k, SEP IRA, Simple IRA, Thrift Savings Plan, Health Savings Account, Profit Sharing Plan, Variable Annuity | | 25 | Cash Flow Analytics Personal | All account types are selected. | | 26 | Cash Flow Analytics Business | All account types are selected. | #### Auto Select All Accounts {#auto-select-all-accounts} If you choose the **Auto select all accounts** option, all the available accounts are automatically selected for the user during the account linking process. This feature is especially useful for applications that need access to all of the user's accounts without requiring the user to manually select each one. ![](https://static.developer.mastercard.com/content/open-finance-us/uploads/auto-select-accounts_1.png) You also have the option to use the **Skip Account selection** feature. This feature bypasses the Account Selection page and takes the user directly to the Account Review page, where they can review the accounts selected to share with Mastercard. Users can still add or remove accounts from the preselected accounts on the Account Review page. This setup is beneficial if you want to simplify the user experience by reducing the number of steps required to link accounts, especially when your application does not require user interaction in selecting accounts. ## Step 4: Customize the Look and Feel {#step-4-customize-the-look-and-feel} You can: * [add your own logo](https://developer.mastercard.com/open-finance-us/documentation/connect/configure-connect-experience/customize-connect/index.md#add-a-logo) on Data Connect. * choose a [brand color](https://developer.mastercard.com/open-finance-us/documentation/connect/configure-connect-experience/customize-connect/index.md#brand-color). * change the behavior of the [back button](https://developer.mastercard.com/open-finance-us/documentation/connect/configure-connect-experience/customize-connect/index.md#back-button) and [exit button](https://developer.mastercard.com/open-finance-us/documentation/connect/configure-connect-experience/customize-connect/index.md#exit-button). * specify whether the Data Connect URL can be used only once ([Single Use URL](https://developer.mastercard.com/open-finance-us/documentation/connect/configure-connect-experience/customize-connect/index.md#single-use-url)). * specify whether to generate a report automatically ([Skip Report](https://developer.mastercard.com/open-finance-us/documentation/connect/configure-connect-experience/customize-connect/index.md#skip-report)).
To alter these settings, navigate to the required experience and open Settings by clicking the gear icon at top right. ![](https://static.developer.mastercard.com/content/open-finance-us/uploads/logo_gear_2.png) The Settings window opens with a preview of the screens of your experience, with the settings to the right. ![](https://static.developer.mastercard.com/content/open-finance-us/uploads/customize-connect-settings_1.png) Tip: You may need to scroll down to see all the options. ### Add a Logo {#add-a-logo} Click the toggle switch next to **Logo** . Choose a file to upload. ![](https://static.developer.mastercard.com/content/open-finance-us/uploads/upload-logo-detail-aug2025.png) #### Logo Upload Requirements {#logo-upload-requirements} Before uploading your logo, ensure it meets the following requirements: 1. **File Format:** Vector images in SVG format are required. If you do not have an image file in the right format, you can try uploading a file in another format such as PNG and the site will attempt to automatically convert it for you. Results using this method may vary. 2. **Maximum File Size:** The logo file must not exceed 100KB. 3. **Maximum Height:** The logo must be suitable to be used with a maximum height of 80px. If you upload a PNG or other bitmap image, it should not be larger than this. #### Edit the Logo {#edit-the-logo} Once uploaded, you can edit the logo to change the size and position of the image. ![](https://static.developer.mastercard.com/content/open-finance-us/uploads/upload-logo-edit-tool.png) ### Brand Color {#brand-color} Enter the hex code for your desired brand color in the **Hex** field under Brand color. ![](https://static.developer.mastercard.com/content/open-finance-us/uploads/brand-color_2.png) This color will be used for CTA buttons, search box outline, search box text, and loading spinner. Below the brand color, you can choose if the CTA text color is black or white, to ensure the text is legible with your brand color. ![](https://static.developer.mastercard.com/content/open-finance-us/uploads/cta-color.png) ### Back Button {#back-button} Use the toggle switch to hide or display the back button in Data Connect. This removes the back button from all Data Connect screens. Note that this only turns off the back button in the Data Connect screens. Customers can still use the browser back button. ![](https://static.developer.mastercard.com/content/open-finance-us/uploads/backicon_customizeconnect.png) ### Exit Button {#exit-button} Use the toggle switch to hide or display the exit button in Data Connect. This removes the exit button from all Data Connect screens. Note that this only turns off the exit button in the Data Connect screens. Customers can still close the browser. ![](https://static.developer.mastercard.com/content/open-finance-us/uploads/exitbutton_customizeconnect.png) After applying the required customizations, click **Menu \> Experiences** to return to the main menu. This displays the page listing the experiences you've created. ### Single Use URL {#single-use-url} This feature only enables a customer to use a link a single time. This is to prevent customers from generating multiple reports through one Data Connect session, or adding multiple accounts when only one is needed. The exact behavior depends on the Account Selection setting: * For a multiple account selection use case, if a user tries to use the same URL twice they will start a new Data Connect session. The user will be able to see previously connected accounts, but a new report will not be generated. * For a single account selection use case, if a user tries to use the same URL twice they will see a screen saying that they have already successfully connected an account. Note: The `singleUserUrl` parameter passed in the [Generate Data Connect URL](https://developer.mastercard.com/open-finance-us/documentation/connect/generate-2-connect-url-apis/index.md#data-connect-full-including-for-joint-borrower) API call for Data Connect Full overrides the value set here. ### Skip Report {#skip-report} Some Data Connect experiences automatically generate a [Lend report](https://developer.mastercard.com/open-finance-us/documentation/products/lend/reports/index.md) by default. Enable **Skip Report** if you do not want a report to be generated automatically when the user completes the experience. Use this option if you only want the experience to connect the user's account and you plan to generate a report later. ## Step 5: Preview or Share Experience {#step-5-preview-or-share-experience} To share or preview a Data Connect experience, click the Share icon. You can either copy the experience URL or share it via an email. Open the URL in a browser to verify that your changes have been applied and see the customizations in action. This URL is a demo URL, not a production URL, so none of the production events will be triggered. There is no limit to the number of demo URLs you can generate. ![](https://static.developer.mastercard.com/content/open-finance-us/uploads/share-demo_2.png) ## Step 6: Apply Customizations {#step-6-apply-customizations} Once you finish configuring the experience, an Experience ID is generated. To view the experience ID, you can do one of the following: * Open the Experience Editor, then click View IDs ![](https://static.developer.mastercard.com/content/open-finance-us/uploads/copyexperienceid.png) * Copy the experience ID from the Experiences list ![](https://static.developer.mastercard.com/content/open-finance-us/uploads/copyexperienceid2.png) To use a specific experience for your product, pass the experience ID in the `experience` parameter while [generating a Data Connect URL](https://developer.mastercard.com/open-finance-us/documentation/connect/generate-2-connect-url-apis/index.md). ## Copy Experience {#copy-experience} Click the Copy icon associated with the experience you want to duplicate. This action will create a new experience with the same settings as the original. You can then modify any settings as necessary to fit the specific needs of the new use case. ## Delete Experience {#delete-experience} To delete an experience, click the Delete icon associated with the experience. Before deleting an experience, make sure this action doesn't impact the user experience and functionality of your application. ## Restoring a Deleted Experience {#restoring-a-deleted-experience} If you've accidentally deleted a customized experience and need to restore it, you can go to **Menu \> Recently Deleted** and click **Restore**. You have up to 30 days from the date of deletion to restore the experience. After this 30-day period, the deleted experience is permanently removed and cannot be restored. ## Tracking Activity {#tracking-activity} To track the activity related to your customized experiences, go to **Menu \> Activity Log**. **Information you can track**: The Activity Log provides detailed records of various actions related to your experiences, including: * **Date changed**: The exact date when a change was made. * **Experience name**: The name of the experience that was modified. * **Experience ID**: A unique identifier for the experience. * **User**: Track who made the change. * **Changes Made** : A description of what changes were made to the experience. Use this log to keep track of all changes, including when an experience was created, modified, or deleted. You can also click **View Details** to see more detailed information about a specific activity.