Docs
Hyperspace Background
Hyperspace Background
A dynamic and customizable background component that simulates a star-filled hyperspace effect.
Ship at the
speed of light
Installation
pnpm dlx shadcn@latest add https://badtz-ui.com/r/hyperspace-background.json
Usage
import { HyperspaceBackground } from "@/components/ui/hyperspace-background";<div className="w-full relative h-[350px]">
<HyperspaceBackground />
</div>Props
HyperspaceBackground props.
| Prop | Type | Description | Default |
|---|---|---|---|
starTrailOpacity | number | Controls the opacity of the star trails, affecting how visible the trails are. | 0.5 |
starSpeed | number | Determines the speed at which the stars move across the canvas. | 1.01 |
starColor | string | Sets the color of the stars, specified in hexadecimal format. | #FFFFFF |
starSize | number | Defines the initial size of the stars. | 0.5 |
className | string | Additional CSS classes to apply to the main container. | - |