Basic Examples

import * as THREE from "three";
import { Particles } from "@threeparticles/core";
 
const fountain = new Particles({
  particles: {
    count: 500,
    gravity: [0, -9.8, 0],
    colors: [
      [
        { color: "cyan", stop: 0 },
        { color: "blue", stop: 1 },
      ],
    ],
  },
  emitter: {
    loop: true,
    spawnMode: "time",
    rate: 100,
    lifetime: [2, 3],
    speed: [5, 8],
    size: [0.05, 0.1],
    directionMin: [-0.2, 1, -0.2],
    directionMax: [0.2, 1, 0.2],
  },
});
 
scene.add(fountain);
fountain.start();

import * as THREE from "three";
import { Particles } from "@threeparticles/core";
 
const fire = new Particles({
  particles: {
    count: 200,
    colors: [
      [
        { color: "yellow", stop: 0 },
        { color: "orange", stop: 0.3 },
        { color: "red", stop: 0.7 },
        { color: "#330000", stop: 1 },
      ],
    ],
    fadeAlpha: [0, 0.7],
    fadeSize: [1, 1.5],
  },
  render: {
    blendingMode: THREE.AdditiveBlending,
  },
  emitter: {
    loop: true,
    spawnMode: "time",
    rate: 50,
    lifetime: [0.5, 1.5],
    speed: [1, 3],
    size: [0.2, 0.4],
    directionMin: [-0.1, 1, -0.1],
    directionMax: [0.1, 1, 0.1],
    startPositionMin: [-0.5, 0, -0.5],
    startPositionMax: [0.5, 0.1, 0.5],
  },
});
 
scene.add(fire);
fire.start();

import { Particles } from "@threeparticles/core";
 
const snow = new Particles({
  particles: {
    count: 1000,
    gravity: [0, -1, 0],
    colors: [[{ color: "white", stop: 0 }]],
  },
  emitter: {
    loop: true,
    spawnMode: "time",
    rate: 30,
    lifetime: [5, 8],
    speed: [0.5, 1],
    size: [0.02, 0.08],
    directionMin: [-0.2, -1, -0.2],
    directionMax: [0.2, -1, 0.2],
    startPositionMin: [-10, 10, -10],
    startPositionMax: [10, 10, 10],
  },
});
 
scene.add(snow);
snow.start();