Hive Mind

A premium, modular React component from the React Bytes collection. Built with React and TypeScript.

Installation

npm install @reactbytes/hive-mind

Usage

import { HiveMind } from "@reactbytes/hive-mind";

export default function Example() {
  return (
    <HiveMind />
  );
}

Properties

| Prop | Type | Default | Description | | :--- | :--- | :--- | :--- | | count | number | 3000 | The total number of particles on screen. | | noiseScale | number | 650 | Zoom level of the noise field. Lower is more chaotic. | | noiseSpeed | number | 0.005 | Speed at which the flow field evolves over time. | | velocity | number | 5 | Movement speed of the particles. | | opacity | number | 0.05 | Trailing effect intensity (tail opacity). Lower is longer trails. | | radius | number | 2 | Base size multiplier for the particles. | | color1 | color | #4b97a2 | Primary particle color. | | color2 | color | #e94b3c | Secondary particle color. | | backgroundColor | color | #000000 | Canvas background color. |

Presets

This component includes the following design presets:

• Classic Hive (default)
• Electric Storm (electric)
• Ghostly Flow (ghost)

Credits & Inspiration

Component Source

• ChandruMIT-o - Design & Development

Inspiration

• Neo Hive Mind - Designer

For interactive playgrounds, customizable controls, and code copy-pasting, visit the full showcase page at React Bytes - Hive Mind.