Interactive Bezier Constellation
Loading Network...
Required Dependencies
npm install gsap @gsap/react react-icons
Architecture & Setup
Copy these files into your codebase matching the structure below:
src/
├── css/
│ └── beizer/
│ └── variables.css
├── types/
│ └── beizer.types.ts
├── constants/
│ └── beizer.constants.ts
├── hooks/
│ └── gsap/
│ └── beizer/
│ ├── index.ts
│ ├── animateBeizer.ts
│ ├── animateBeizerFadeScale.ts
│ ├── animateBeizerSvgPath.ts
│ └── useBeizerAnimation.ts
├── services/
│ └── ui.utilities/
│ └── beizer/
│ ├── index.ts
│ ├── generatePath.ts
│ ├── getPositions.ts
│ └── getRadiatingOrder.ts
└── components/
└── beizer/
├── Beizer.tsx
├── BeizerCenter.tsx
├── BeizerDesktop.tsx
├── BeizerLoader.tsx
├── BeizerMobile.tsx
└── BeizerNode.tsx
Animation Controls
Constellation Presets
Customize Topology
8 Nodes
0.30
Max 8