react-background-bubble v1.0.0

BackgroundBubbles Component

Description

BackgroundBubbles is a React component that creates a background with animated bubbles. It can be used to add a visually appealing background to your web application.

Installation

npm install react-background-bubble

## Usage
import React from "react";
import BackgroundBubbles from "background-bubbles-react";

const App = () => {
  return (
    <div>
      <BackgroundBubbles
        bubblesCount={24} // Number of bubbles (default: 24)
        bubbleContainerBg="lightblue" // Background color of the bubble container
        bubbleOneBg="white" // Background color for bubbles with odd indices
        bubbleTwoBg="black" // Background color for bubbles with even indices
      >
      <YourComponent/>
      </BackgroundBubbles>
    </div>
  );
};

export default App;

## Props

bubblesCount (optional, default: 24): Number of bubbles to render in the background.

bubbleContainerBg (optional): Background color of the bubble container.

bubbleOneBg (optional): Background color for bubbles with odd indices.

bubbleTwoBg (optional): Background color for bubbles with even indices.

<BackgroundBubbles
  bubblesCount={36}
  bubbleContainerBg="lightblue"
  bubbleOneBg="white"
  bubbleTwoBg="black"
>
  <h1>Your App Content</h1>
</BackgroundBubbles>