npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2025 – Pkg Stats / Ryan Hefner

@exawizards/exabase-design-system-icons

v1.5.0

Published

Icon library for exaBase Design System

Readme

exaBase Design System Icons

exaBase Design System Icons is a collection of generic, simple and neutrally designed icons that is free for personal and commercial use.

Browse Icons

Install

npm

Install icons from npm - including SVGs, icon fonts and CSS files.

npm i @exawizards/exabase-design-system-icons

Then import CSS to your Javascript file.

import "@exawizards/exabase-design-system-icons/font/exabase-design-system-icons.css";

CDN

Download icon font files from CDN by including them in the <head> of your web page.

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@exawizards/[email protected]/font/exabase-design-system-icons.css" />

Usage

Embedded

The quickest way to use icons is to copy the SVG code of the icon you need and inline it directly into your HTML. You can get the SVG code by clicking on the icon on this page.

<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 32 32" fill="#000000">
  <path d="M16.0001 28C16.2653 28 16.5196 27.8946 16.7072 27.7071L27.7102 16.7041C28.1007 16.3136 28.1007 15.6804 27.7102 15.2899C27.3196 14.8994 26.6865 14.8994 26.2959 15.2899L17.0001 24.5858L17.0001 5C17.0001 4.44772 16.5523 4 16.0001 4C15.4478 4 15.0001 4.44772 15.0001 5L15.0001 24.5858L5.70418 15.2899C5.31365 14.8994 4.68049 14.8994 4.28996 15.2899C3.89944 15.6804 3.89944 16.3136 4.28996 16.7041L15.2929 27.7071C15.4805 27.8946 15.7348 28 16.0001 28Z"/>
</svg>

The size can be changed with the width and height attributes, and the color can be changed with the fill attribute.

<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 32 32" fill="#1400c8">
  <path d="M16.0001 28C16.2653 28 16.5196 27.8946 16.7072 27.7071L27.7102 16.7041C28.1007 16.3136 28.1007 15.6804 27.7102 15.2899C27.3196 14.8994 26.6865 14.8994 26.2959 15.2899L17.0001 24.5858L17.0001 5C17.0001 4.44772 16.5523 4 16.0001 4C15.4478 4 15.0001 4.44772 15.0001 5L15.0001 24.5858L5.70418 15.2899C5.31365 14.8994 4.68049 14.8994 4.28996 15.2899C3.89944 15.6804 3.89944 16.3136 4.28996 16.7041L15.2929 27.7071C15.4805 27.8946 15.7348 28 16.0001 28Z"/>
</svg>

External image

Put the icon SVG files to your directory and reference them with the <img> element.

<img src="/assets/img/arrow.svg" alt="" width="24" height="24" />

Icon font

After importing the CSS file into your website using one of the ways described in Install, copy and paste the HTML code for the icon you want into your HTML. You can get the HTML code by clicking on the icons on the icons page.

<i class="ei ei-bookmark-fill"></i>

Size and color can be changed by font-size and color with custom CSS.

<i class="ei ei-bookmark-fill" style="font-size: 16px; color: #1400c8;"></i>

License

exaBase Design System Icons is licensed under the MIT License.

Copyright

©️ ExaWizards Inc.