Dubalu Icons

A collection of custom SVG icons for React, designed by the Dubalu team and ready to be used as React components with full SVG props support.

Installation

Install Dubalu Icons with npm

npm install @dubaluofficial/dubalu-icons
# o
yarn add @dubaluofficial/dubalu-icons

Import the icon you need and use it in your React components. Icons accept all standard SVG properties, including width, height, color, className, etc.

import React from "react";
import { Retweet, Yahoo, YoutubePlay } from "@dubaluofficial/dubalu-icons";

export function MyComponent() {
  return (
    <div>
      <Retweet width={32} height={32} color="green" />
      <Yahoo width="2em" height="2em" fill="orange" />
      <YoutubePlay className="icon-play" />
    </div>
  );
}

Features

• Each icon is a functional React component.
• Support for all SVG props thanks to SVGProps.
• Default size is 1em for easy scaling with text.
• Color controllable via CSS using the color property or fill="currentColor" prop.
• Easy to extend and update.

Deployment

If you want to modify or add icons:

Place your SVG files in the src/icons folder.

Run the icon generation script (using node version v16.20.2):

    npm run build:icons

    npm run build

License

MIT

Authors

• @dubaluofficial

Preview