Edit in JSFiddle

// Simple three.js example
// https://www.jsdelivr.com/package/npm/three
import * as THREE from "https://cdn.skypack.dev/[email protected]/build/three.module.js";
import { OrbitControls } from "https://cdn.skypack.dev/[email protected]/examples/jsm/controls/OrbitControls.js";

let renderer, scene, camera, controls;

init();
animate();
function init() {
    renderer = new THREE.WebGLRenderer();
    renderer.setSize( window.innerWidth, window.innerHeight );
    document.body.appendChild( renderer.domElement );
    scene = new THREE.Scene();
    camera = new THREE.PerspectiveCamera( 40, window.innerWidth / window.innerHeight, 1, 100000000 );
    camera.position.set( 800, 800, 800 );
    controls = new OrbitControls( camera, renderer.domElement );
    scene.add( new THREE.AmbientLight( 0x222222 ) );
    let light = new THREE.DirectionalLight( 0xffffff, 1 );
    light.position.set( 20, 20, 0 );
    scene.add( light );
    scene.add( new THREE.AxesHelper( 20 ) );
    //document.addEventListener('keypress', onKeyPress, true);
    window.addEventListener( 'resize', onWindowResize, false );
}

function animate() {
    requestAnimationFrame( animate );
    renderer.render( scene, camera );
}

function onWindowResize(){
    camera.aspect = window.innerWidth / window.innerHeight;
    camera.updateProjectionMatrix();
    renderer.setSize( window.innerWidth, window.innerHeight );
}



// --------------------------------------




function getRandomInt(max) {
  return Math.floor(Math.random() * Math.floor(max));
}

function getPointInBetweenByT(a, b, t=0.5) {
  let pp = new THREE.Vector3((a.x+b.x) * t, (a.y+b.y) * t, (a.z+b.z) * t);
  return pp;
}



// --------------------------------------



let radius = 300;

function getRandomPtOnSphere() {
	let u = Math.random();
	let v = Math.random();
  let phi = 2 * Math.PI * u;
  let theta = Math.acos((2 * v) - 1);
  let pt = new THREE.Vector3();
  pt.x = radius * Math.sin(phi) * Math.cos(theta);
  pt.y = radius * Math.cos(phi);
  pt.z = radius * Math.sin(phi) * Math.sin(theta);
  return pt;
}

let t = 0.42;

let size = 800;
let focus = new THREE.Vector3(0, 300, 0);
function getCol(pRat) {
	return new THREE.Color(0.4 + pRat, 0 + pRat, 0.2 + pRat);
}

let particleCount = 200000;
let jump = size / 20;



let prev = new THREE.Vector3();

let vertices = [];
let colors = [];

for (let p = 0; p < particleCount; p++) {
      let pP = prev.clone();
      let rP = getRandomPtOnSphere();
      let np = getPointInBetweenByT(pP, rP, t);
      let particle = new THREE.Vector3(np.x, np.y, np.z);
      prev = np;
      
      vertices.push(np.x, np.y, np.z);
      
      let pRat = particle.distanceTo(focus) / size;
      let col = getCol(pRat);
      colors.push(col.r, col.g, col.b);
}

let particles = new THREE.BufferGeometry();
let pMaterial = new THREE.PointsMaterial({ size: 2, vertexColors: true });
let v = Float32Array.from(vertices);
particles.setAttribute("position", new THREE.BufferAttribute(v, 3));
let c = Float32Array.from(colors);
particles.setAttribute("color", new THREE.Float32BufferAttribute(c, 3));

let particleSystem = new THREE.Points(particles, pMaterial);

scene.add(particleSystem);