Plasma Rise
An upward-rising plasma effect with deep background colors and muted red/brown tones, featuring warm white specular highlights.
Props
| Property | Type | Default | Description |
|---|---|---|---|
| color1 | string | #050505 | Deep background color |
| color2 | string | #331111 | Main rising color |
| speed | number | 1.0 | Upward velocity |
| intensity | number | 0.5 | Shine/Specular amount |
When to Use
Excellent for dark-themed landings, tech blogs, or creative portfolios where a vertical flow or 'energy' effect is desired.
Best Practices
Use with dark background colors to make the 'rising' plasma threads pop. It works particularly well as a subtle layer behind high-tech UI components.
Why This Component Matters
Verticality creates a narrative of growth and upward momentum. This shader-based plasma effect provides a unique alternative to traditional horizontal or radial gradients.
FAQ
QHow do I make the glow stronger?
Increase the `intensity` prop to sharpen the specular highlights and make the plasma threads appear brighter.
QCan the speed be negative?
The current logic is optimized for rising motion, but you can adjust the `speed` to slow it down to a near-static drift.
QIs there a grain effect?
Yes, a premium fine grain is built-in to prevent banding and add a cinematic texture to the background.
Related Components
Interstellar Fluid Hero
Interactive fluid simulation creating cosmic nebula effects with mouse interaction. Deep space aesthetic with animated gas clouds and star trails.
Interstellar Background Hero
Warp tunnel effect simulating high-velocity travel through nebular clusters. Procedural WebGL engine with mouse-responsive space distortion.
Liquid Chrome Hero
Procedural simulation of molten chrome alloys with velocity-based distortion. Interactive liquid metal surface with specular highlights.
Built something cool?
Share your work with 10k+ devs — or tell us how we can improve.