@flodlc/nebula

Nebula

$3

Including configurable Stars, Nebulas, Comets, Planets and Suns.
Nebula comes with a vanilla JS and a React wrapper.
Compatible with SSR

Demo page

$3

``
npm install @flodlc/nebula
`

$3

#### Vanilla JS
`javascript
import { createNebula } from "@flodlc/nebula";

const element = document.getElementById("nebula-element");

const nebula = createNebula(element, {
starsCount: 250,
starsRotationSpeed: 3,
nebulasIntensity: 8,
...
});
// ... if needed:
nebula.destroy()
`

#### React
`javascript
import { ReactNebula } from "@flodlc/nebula";

export default App = () => {
return (
<>
// With default config


// With custom config
starsCount: 250,
starsRotationSpeed: 3,
nebulasIntensity: 8,
...
}}/>

);
}
`
The canvas is positioned absolute and takes the size of its parent.


$3


key | option type | default | Comment
---|-----------|---|---
starsCount | number | 350 | Recommended: < 1000
starsColor | string | #ffffff
starsRotationSpeed | number | 3
cometFrequence | number | 15 | 0 disables the comets
nebulasIntensity | number | 10
sunScale | number | 1 | 0 hides the Sun
planetsScale | number | 1 | 0 hides the planets
solarSystemOrbite | number | 65 | Recommended: < 100
solarSystemSpeedOrbit | number | 100`