# svelte-fluid

> WebGL Navier–Stokes fluid simulation as a Svelte 5 component library. Multi-instance, resize-stable, deterministic seeding. MIT licensed, zero runtime dependencies.

svelte-fluid renders interactive fluid on a canvas through a thin Svelte 5 wrapper around a framework-agnostic WebGL engine (a port of Pavel Dobryakov's WebGL-Fluid-Simulation). Six components and fourteen zero-config presets. Requires Svelte 5.

## Docs

- [Getting Started](https://svelte-fluid.dev/docs): install and first component
- [Components](https://svelte-fluid.dev/docs/components): all six components, props, examples
- [Configuration](https://svelte-fluid.dev/docs/configuration): full FluidConfig prop reference (70+ props)
- [Container shapes](https://svelte-fluid.dev/docs/shapes): ContainerShape variants and fields
- [Presets](https://svelte-fluid.dev/docs/presets): all 14 presets with configs and playground links
- [Imperative API](https://svelte-fluid.dev/docs/api): FluidHandle, RGB, PresetSplat

## Agent resources

- [SKILL.md](https://svelte-fluid.dev/SKILL.md): full agent skill — engine mental model, components, config, presets, API
- [llms-full.txt](https://svelte-fluid.dev/llms-full.txt): the entire reference inlined in one file

## Presets

- LavaLamp (classic): Warm buoyant blobs rising in a glass vessel.
- Plasma (classic): A confined full-spectrum plasma ball churning at center.
- InkInWater (classic): India-ink droplets blooming as they sink through dark water.
- FrozenSwirl (classic): A single icy whirlpool that spins out and freezes in place.
- Aurora (classic): Layered green and magenta ribbons glowing like northern lights.
- CircularFluid (container): Vivid fluid swirling inside a circular container.
- FrameFluid (container): Fluid circulating around a rectangular picture-frame cutout.
- AnnularFluid (container): A ring-vortex orbiting between two concentric circles.
- SvgPathFluid (container): Fluid confined to an ampersand glyph (text container shape).
- Toroidal (container): A violent full-spectrum storm circulating in a toroidal ring.
- GasFlare (flow): A hot buoyant jet rising from a flare-stack nozzle.
- Venturi (flow): Bernoulli's principle: flow accelerating through a pinched throat.
- Karman (flow): Flow past a cylinder, evoking a von Kármán vortex street.
- TeslaValve (flow): Throughflow routing through a passive Tesla-valve channel.