Documentation

Documentation Components

Nebula

A volumetric gas nebula sealed inside polished glass; billowing emission clouds with hollow dark cavities and hot glowing cores, star fields drifting at real depth behind the gas, all refracted through the curved walls of the shape and dressed with studio reflections

Props

originstring
Default:center
Reference edge the center position is measured from (center default). Lets you pin the shape relative to a corner or the canvas centre.
center{x: number, y: number}
Default:{"x":0.5,"y":0.5}
Center position of the nebula shape
scalenumber
Default:1
Scale of the nebula shape (1 = default size)
rotationnumber
Default:0
Rotation of the nebula shape in degrees
coreColorstring
Default:#ffd9b0
The hot colour the densest gas cores glow with — the embedded newborn stars
gasColorstring
Default:#ff5e7a
The main emission colour of the gas body — H-alpha rose by default
veilColorstring
Default:#3a5bdb
The colour of the thin outer veils and the deep-space background behind the gas
colorSpace"linear" | "oklch" | "oklab" | "hsl" | "hsv" | "lch"
Default:oklab
Color space the veil → gas → core ramps blend in
densitynumber
Default:1
Optical density of the gas — how strongly clouds occlude the stars and gas behind them
cavitynumber
Default:0
How hollowed-out the nebula is — 0 fills the volume with cloud banks, high carves large dark voids between them
dustnumber
Default:0.55
Cold dark dust lanes threading the gas — absorb-only tendrils that redden the clouds and stars behind them
gasScalenumber
Default:0.4
Feature size of the gas — higher = finer, busier cloud detail
billownumber
Default:0.6
Turbulent folding of the clouds — 0 = smooth drifting banks, 1 = heavily churned billows
glownumber
Default:0
Hot emission bloom of the dense cores
seednumber
Default:0
Random seed — pans the gas field to a different region of noise space for a new cloud composition
starsnumber
Default:0.07
Brightness of the star fields drifting at depth behind and inside the gas
starScalenumber
Default:1
Density of the star fields — higher = smaller, busier stars
twinklenumber
Default:0.35
Intensity of the star twinkle (0 = steady stars, 1 = full shimmer)
refractionnumber
Default:0.5
How strongly the curved glass walls bend the interior seen near the edges
environmentnumber
Default:0.7
Strength of the studio softboxes reflected in the polished glass surface
highlightnumber
Default:1.15
Sharp key-light glint on the glass
highlightSoftnessnumber
Default:0.5
Specular highlight softness — lower is a tighter, sharper glint
lightAnglenumber
Default:315
Direction of the key light and reflected studio, in degrees
edgeSoftnessnumber
Default:0.05
Softness of the shape boundary edge
speednumber
Default:0.3
Speed of the slowly churning gas and twinkling stars. 0 freezes the nebula.
shapeShapeConfig
Default:prism3D
Shape to render — choose from 11 built-in analytical shapes or supply a custom SDF. See the Shape Effects guide for all available shapes and their options.
shapeSdfUrlstring
Default:""
URL to a pre-generated SDF `.bin` file — when non-empty, activates SVG mode and triggers a shader recompile. See the Shape Effects guide for how to generate an SDF from an SVG.

Usage

<Shader>
  <Nebula />
</Shader>
Previous
MultiPointGradient
Next
Neon