Display
Particles Constellation
A dark canvas where particles drift and connect into constellation lines near each other.
by mcpSkills
Framework
nextjs
UI Library
shadcntailwind
Difficultyadvanced
English Prompt
Create a particle constellation background. Use a canvas or SVG to render small drifting dots that connect with thin lines when they are close to each other. Particles should also gently move away from the cursor. Use a dark background and subtle white/blue particles. Keep the number of particles modest for performance. Use JavaScript for the particle system and Tailwind CSS for the container.
Chinese Prompt
创建一个粒子连线星座背景。使用 canvas 或 SVG 渲染小漂移点，当彼此靠近时用细线连接。粒子还应轻微远离光标移动。使用深色背景和微妙的白/蓝色粒子。为性能保持粒子数量适中。使用 JavaScript 实现粒子系统，Tailwind CSS 设置容器样式。
## Overview
A living network background that suggests connection, data, or intelligence. Common in AI, security, and network products.
## Features
- Drifting particles
- Proximity-based connection lines
- Cursor repulsion
- Dark background
- Canvas/SVG rendering
- Performance-conscious count
## Usage
Use for hero backgrounds, loading screens, or tech-focused sections.
## Customization
Modify the prompt to:
- Change particle color to brand accent
- Add connection line color gradient
- Increase particle count on larger screens
- Make particles form a specific shape