Black Hole Cursor
Black Hole Cursor is a cursor effect in the UI HUB cursor effects collection. A gravitational singularity cursor with particles orbiting and spiraling inward. On click, particles implode then explode outward. Multi-layered accretion disk glow rings.
The component is driven by 4 documented props (particleCount, coreSize, glowColor, particleColor), so colours, intensity, timing and density can be tuned from the call site instead of being hard-coded.
Implementation notes: Canvas 2D particle simulation; Polar coordinate orbital physics; Spiral inward gravity (distance *= 0.998).
Preview the cursor effect in the browser above, copy the source, and paste it into your project. Cursor Effects components in UI HUB are grouped by category so you can compare effects side by side before choosing one.
What is Black Hole Cursor?
Cinematic black hole cursor with particle physics and accretion disk. It is built as a React and Tailwind CSS component and can be previewed directly on this page.
Black Hole Cursor at a glance
- Category
- Cursor Effects
- Pricing
- Pro component
- Libraries
- React
- Styling
- Tailwind CSS
- Configurable props
- 4
- AI prompts
- Ready for Advance, Antigravity, Claude Code, Cursor, Lovable
How Black Hole Cursor works
A gravitational singularity cursor with particles orbiting and spiraling inward. On click, particles implode then explode outward. Multi-layered accretion disk glow rings.
Technical information for Black Hole Cursor
| Category | Cursor Effects |
|---|---|
| Libraries | React |
| Styling | Tailwind CSS |
| Rendering | HTML canvas, CSS gradients |
| State change | orbiting particles to implode/explode on click |
| Props | 4 configurable |
| Usage example | Not published yet |
What Black Hole Cursor requires
- Canvas 2D particle simulation
- Polar coordinate orbital physics
- Spiral inward gravity (distance *= 0.998)
- Click implode/explode effect
- Multi-layer radial gradient core rendering
- Trail effect via semi-transparent fillRect
Black Hole Cursor questions
What is Black Hole Cursor?
Cinematic black hole cursor with particle physics and accretion disk. It is built as a React and Tailwind CSS component and can be previewed directly on this page.
How does Black Hole Cursor work?
A gravitational singularity cursor with particles orbiting and spiraling inward. On click, particles implode then explode outward. Multi-layered accretion disk glow rings.
Which category does Black Hole Cursor belong to?
Black Hole Cursor is listed under Cursor Effects in the UI HUB catalog. Custom cursor components that replace the system pointer with something branded: magnetic attraction, trail effects, target reticles, blend modes and blob followers. Each one is pointer-aware and responsive, and exposes props for colour, smoothing and activation zones. Best used on portfolio and agency sites where the cursor becomes part of the identity.
What does the particleCount prop do in Black Hole Cursor?
Number of orbiting particles around the singularity. It defaults to 120.
What does the coreSize prop do in Black Hole Cursor?
Radius of the black hole core in pixels. It defaults to 12.
Is Black Hole Cursor free to use?
Black Hole Cursor is a Pro component on UI HUB. Pro components are labelled in the catalog and come with a documented props table on the component page.
Which libraries does Black Hole Cursor use?
Black Hole Cursor uses React and is styled with Tailwind CSS.
What does Black Hole Cursor need to run?
Black Hole Cursor needs Canvas 2D particle simulation, Polar coordinate orbital physics, Spiral inward gravity (distance *= 0.998) and Click implode/explode effect.