Nigerian Bank Logos

A curated collection of high-quality SVG logos for Nigerian banks, fintech companies, and businesses listed on the Nigerian Exchange (NGX). This project provides a centralized resource for designers and developers to easily access and use these logos in their projects.

Explore  ▪️  Request logo  ▪️  Submit logo  ▪️  Figma Plugin  ▪️  API  ▪️  Contributing

---

---

✨ Features

• High-Quality SVGs: All logos are in SVG format, ensuring they are scalable and look great on any device.
• Easy to Use: Search, copy, or download logos in various formats.
• Developer Friendly: Public API for programmatic access.
• Figma Plugin: Insert logos directly into your Figma designs.
• Categorized: Organized by "Banks," "Fintech," "NGX," and more.
• Light & Dark Mode: Fully responsive for both themes.

🚀 Tech Stack

• Framework: Next.js
• Styling: Tailwind CSS
• UI Components: shadcn/ui
• Search: Fuse.js
• SVG Utilities: SVGO (for optimization)
• Deployment: Brimble

🧩 Extensions & Integrations

Nigerian Bank Logos can be used in various environments and tools:

• Figma Plugin: See Figma Plugin
• API: See API Docs —feel free to build your own!

🏁 Getting Started

Prerequisites

• Node.js (v18 or higher)
• pnpm (recommended) or npm/yarn

Installation

1. Clone the repo

   git clone https://github.com/Pariola-droid/Nigerian-Bank-Logos
   cd nigerian-bank-logos

2. Install dependencies

   pnpm install

3. Run the development server

   pnpm dev

Open http://localhost:3000 in your browser.

---

🖼️ Adding a New Logo

Important

Only submit SVGs you have permission to use, or that are under a license compatible with this project. Optimize SVGs with SVGOMG and ensure the viewBox is preserved. Max size: 24kb.

1. Fork the repository and create a new branch:

   git checkout -b feature/add-new-logo

2. Add your SVG to the public/library directory. Use lowercase, kebab-case filenames (e.g., access-bank.svg).

3. Add metadata for your logo in src/data/logos.ts:

   {
       title: "Bank Name",
       categories: ["Bank", "NGX"],
       route: "/library/bank-name.svg",
       url: "https://bankwebsite.com",
       ticker: "TICKER" // For NGX-listed companies
   }

Note

• The list of categories is here: src/types/categories.ts. You can add a new category if you need it.
• You can add multiple categories by separating them with commas in the categories array, sample: categories: ["Bank", "Fintech"].

4. Commit and push your changes:

   git commit -m "feat: add Bank Name logo"
   git push origin feature/add-new-logo

5. Open a Pull Request and describe your addition.

---

🤝 Contributing

• Enhancements: Open an issue with the "enhancement" label.
• Bug Reports: Please provide clear steps to reproduce and screenshots if possible.
• Extensions: If you build an integration or plugin, let us know! We’ll feature it here.

All contributors must follow our Code of Conduct.

---

📜 License

Distributed under the MIT License. See LICENSE for details.

---

🙏 Acknowledgements

• Inspiration: svgl.app by pheralb
• UI Components: midday by pontusab
• Logos: All logos are the property of their respective owners.