Banks DB (Bankcard BIN Database)
The `banks-db` library provides a client-side database of bank identification numbers (BINs) to retrieve bank names and associated brand colors based on a bankcard prefix. Its primary function is to enhance user experience on billing pages, for example, by dynamically displaying a bank's logo or changing background colors as a user types their card number. It is crucial to understand that this database is community-driven and explicitly warns against its use for any billing logic, fraud detection, or security-sensitive operations due to potential inaccuracies or incompleteness. The current stable version is 0.23.0, and the package maintains a relatively active release cadence, with minor version updates typically occurring every few weeks to months, often reflecting database updates or small feature enhancements. A key differentiator is its dual approach: offering a comprehensive global dataset through the main export, alongside the ability to selectively load country-specific data for optimized bundle sizes, with direct integration examples for PostCSS and CSS-in-JS environments.
Common errors
-
TypeError: banksDB is not a function
cause Attempting to import `banksDB` as a named export (`import { banksDB } from 'banks-db';`) or accessing it as a property on the `require` result in CommonJS.fixUse a default import for ESM: `import banksDB from 'banks-db';` or a direct `require` for CommonJS: `const banksDB = require('banks-db');`. -
Cannot read properties of undefined (reading 'color') (or similar for 'engTitle', 'code')
cause Accessing properties of the `bank` object (e.g., `bank.color`) without first verifying that `bank.code` exists, which indicates that a matching bank was found in the database.fixAdd a conditional check: `const bank = banksDB(cardNumber); if (bank.code) { /* use bank.color */ } else { /* handle unknown bank */ }`. -
Importing country-specific data causes entire `banks-db` package to be bundled or increases bundle size unexpectedly.
cause Incorrectly importing all banks then trying to filter, or using the main `banks-db` package when only a few countries are needed.fixFor specific countries, import `banksDBCore` from `banks-db/core` and then import only the required country data from `banks-db/banks/[cc]` (e.g., `import banksOfRussia from 'banks-db/banks/ru';`). Initialize `banksDBCore` with only the data you need.
Warnings
- gotcha Do not use `banks-db` for any critical billing logic, fraud detection, or security-sensitive operations. The database is community-driven and may contain inaccuracies or be incomplete, making it unsuitable for financial validation beyond UX enhancements.
- breaking As `banks-db` is currently in `0.x.0` versioning, any minor release (e.g., from 0.22.0 to 0.23.0) *could* potentially introduce breaking changes to the API or data structure, although this is not explicitly documented for every release. Database updates might also alter `bank.code` or other property values for existing BINs.
- gotcha The `banksDB` function returns an object with a `type` property (e.g., 'visa', 'mastercard') even if no bank-specific data is found. The `code`, `color`, `engTitle`, etc., properties will be `undefined` if the BIN is not in the database. Always check for `bank.code` to determine if detailed bank information is available.
Install
-
npm install banks-db -
yarn add banks-db -
pnpm add banks-db
Imports
- banksDB
import { banksDB } from 'banks-db'; const banksDB = require('banks-db').banksDB;import banksDB from 'banks-db';
- banksDB.data
import { data } from 'banks-db';import banksDB from 'banks-db'; const allBanksData = banksDB.data;
- banksDBCore
import { banksDBCore } from 'banks-db/core'; const banksDBCore = require('banks-db/core').banksDBCore;import banksDBCore from 'banks-db/core';
- banksOfCountry
import { ru } from 'banks-db/banks'; import { banksOfRussia } from 'banks-db/banks/ru';import banksOfRussia from 'banks-db/banks/ru'; const banksOfChina = require('banks-db/banks/cn');
Quickstart
import banksDB from 'banks-db';
// Simulate a card number input field
const cardNumberField = { value: '5275940000000000' };
// In a real application, you'd get this from an input element:
// const cardNumberField = document.getElementById('cardNumberInput');
const bank = banksDB(cardNumberField.value);
if (bank.code) {
console.log('Bank found!');
console.log(`Bank Code: ${bank.code}`); // e.g., 'ru-citibank'
console.log(`Bank Name (EN): ${bank.engTitle}`); // e.g., 'Citibank'
console.log(`Card Type: ${bank.type}`); // e.g., 'mastercard'
console.log(`Brand Color: ${bank.color}`); // e.g., '#F8C220'
console.log(`Country: ${bank.country}`); // e.g., 'ru'
// Example of applying styles based on bank data
// document.body.style.backgroundColor = bank.color;
} else if (bank.type) {
console.log('Bank not found in DB, but card type identified: ' + bank.type);
} else {
console.log('No bank or card type identified for this prefix.');
}
// To see the raw data (for debugging or custom processing)
// console.log('\nFull Banks DB Data:');
// for (const b of banksDB.data) {
// console.log(b.code, b.engTitle);
// if (b.code === 'ru-citibank') break; // Limit output for brevity
// }