Home/Libraries/Elusive Icons

// ICON LIBRARY

Elusive Icons

A clean, customisable web font and SVG vector icon set optimized for Bootstrap layouts.

reactvuesveltenextjsvanillaOFL-1.1

GitHub →Official Site →

STATS

304

Icons

1,200

GitHub Stars

5K

Weekly Downloads

OFL-1.1 / MIT

License

Highly lightweight (~1.5kb per icon)

Bundle Size

2013

Since

OVERVIEW

Elusive Icons is a classic web-focused icon set containing 304 slick, pictographic vectors originally designed to complement the Bootstrap framework. Maintained by Team Redux, it provides a balance of core interface elements, social media networks, and platform branding options.

The design language of Elusive Icons favors solid, visually weighted pictograms over light line weights. This makes them highly legible at small resolutions and standard interface dimensions, providing strong visual anchors for buttons, alert boxes, and navigation sidebars.

Elusive Icons is licensed under the SIL Open Font License 1.1 (OFL-1.1) for its font resources and the MIT License for its code implementation. It is fully integrated with the Iconify runtime under the 'el' collection prefix, enabling tree-shakable web component integration in modern frameworks.

// VERDICTElusive Icons is an ideal fit for legacy migrations, projects leveraging Bootstrap grids, or applications requiring bold, high-contrast visual signifiers. For modern minimalist designs requiring 1px layouts, pairing it with Feather or Lucide is recommended.

OFFICIAL LICENSE & COMMERCIAL USE

License TypeOFL-1.1 / MIT License

Elusive Icons is licensed under the OFL-1.1 / MIT license, which is a developer-friendly permissive open-source license. You are permitted to use it free of charge in your web and mobile applications, including commercial and SaaS products, without strict attribution requirements.

✓ Permissions

Commercial Use Allowed
Modification Allowed
Redistribution Allowed
Sublicensing Allowed

⚠️ Requirements

Must keep copyright notice in source files
License remains active on copy/use

INSTALLATION

react

npm install elusive-icons

nextjs

npm install elusive-icons

// Note: Import raw SVG components or link the CDN font-face stylesheet inside Next.js layout structures.

vue

// Load using Iconify Vue wrapper with 'el:' prefix

svelte

// Fetch via standard Iconify Svelte interface

vanilla

<!-- Import CSS from CDN -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/elusive-icons@latest/css/elusive-icons.min.css">

CODE EXAMPLES

basic

// Using standard font-icon classes
export function DashboardItem() {
  return (
    <div className="flex items-center gap-2">
      <i className="el el-home"></i>
      <span>Dashboard</span>
    </div>
  )
}

with Tailwind

// Tailwind integration with size classes
export function AlertBox() {
  return (
    <div className="flex gap-3 p-4 bg-amber-500/10 text-amber-500 rounded-lg">
      <i className="el el-warning text-xl leading-none"></i>
      <div>Warning details...</div>
    </div>
  )
}

vanilla J S

<!-- Render Elusive icon via Iconify component -->
<iconify-icon icon="el:home" style="font-size: 24px; color: #3b82f6;"></iconify-icon>

PROS & CONS

PROS

✓ Bootstrap native structure

Perfect drop-in alignment for Bootstrap projects and legacy grid layouts.

✓ High-contrast designs

Bold, filled pictograms offer excellent visual anchors for calls-to-action.

✓ Permissive licensing

OFL-1.1 and MIT allow worry-free integration in commercial software systems.

CONS

✗ Legacy aesthetic style

Visual elements match older 2010s corporate layouts and may feel dated on ultra-modern sites.

✗ No line/outline options

Designed strictly as solid glyphs; lacks linear variations for thin border designs.

WHO SHOULD USE THIS

USE IF YOU...

→Developers working on legacy Bootstrap migrations, admin dashboards, and corporate portals

→Products where bold, solid visual weight is preferred over thin outline configurations

→Teams requiring solid corporate indicators and platform branding marks

AVOID IF YOU...

✗Modern, minimalist interfaces looking for 1px lines or rounded outline frameworks

✗Projects requiring extensive sets containing thousands of highly specialized indicators

FREQUENTLY ASKED QUESTIONS

Q.What is the official prefix for Elusive Icons?

A.The CSS prefix is 'el' (e.g. 'el el-home'). In the Iconify database, it is mapped using the 'el' prefix.

Q.Who maintains the library?

A.Elusive Icons is maintained by Team Redux (developers of the Redux Framework for WordPress).

Q.Can I customize the color and size?

A.Yes. When used as a font, customize size via font-size and color via CSS color. When used as SVGs, standard fill/stroke styling applies.

COMPARE WITH ALTERNATIVES