react-oddball-icons/README.md

Odd corporate logos to spice up your website

# React Oddball Icons

A weird little icon set for React with corporate vibes and oddball charm. For UI's that don’t take themselves too seriously.

🌐 [Official Website](https://react-oddball-icons.vercel.app/)

## ✨ Features

- ⚛️ Easy-to-use React components
- 🎯 Fully typed, which gives them great TypeScript support out of the box
- 🎨 Scalable SVGs with size and styling flexibility
- 🧃 Slightly weird, mildly corporate, always charming

## 🚀 Installation

Install via npm:

```bash
  npm install react-oddball-icons
```

## 🧰 Usage

After the installation, you can quickly get started by importing the icon you want into your project like this:

```jsx
import { Avatar } from "react-oddball-icons";

const HelloWorld = () => {
  return (
    <>
      <Avatar />
    </>
  );
};

export default HelloWorld;
```

## 🎨 Styling

You can easily customize the appearance of your icons using standard CSS or inline styles. For example:

```jsx
import { Avatar } from "react-oddball-icons";

const HelloWorld = () => (
  <>
    <Avatar
      width={60}
      height={60}
      style={{
        padding: "10px",
        borderRadius: "8px",
        backgroundColor: "#f3f4f6",
      }}
    />
  </>
);

export default HelloWorld;
```

## Available Icon Components

- `ArrowDown`
- `ArrowLeft`
- `ArrowRight`
- `ArrowUp`
- `Avatar`
- `AvatarAlt`
- `Bell`
- `BellAlt`
- `Bookmark`
- `BookmarkAlt`
- `Calculator`
- `CalculatorAlt`
- `Calender`
- `CalenderAlt`
- `Clock`
- `ClockAlt`
- `Document`
- `DocumentAlt`
- `Envelope`
- `EnvelopeAlt`
- `Hamburger`
- `HamburgerAlt`
- `Heart`
- `HeartAlt`
- `Lock`
- `LockAlt`
- `MagnifyingGlass`
- `MagnifyingGlassAlt`
- `Pin`
- `PinAlt`
- `Presentation`
- `PresentationAlt`
- `SpeechBubble`
- `SpeechBubbleAlt`
- `StapleDiagram`
- `StapleDiagramAlt`
- `Suitcase`
- `SuitcaseAlt`
- `TrashCan`
- `TrashCanAlt`