Topology — live WebGL hero effect

Vanta.js · vanta@0.5.24 · MIT

Topology — an animated WebGL hero background from Vanta.js (MIT, open source). Rendered and measured live: 16fps on a 1440×900 canvas. Exact config shipped as tokens · npm i vanta three.

Open in Mozaika →

This is a static, crawlable rendering for search & AI engines. The interactive version — filters, live decode console, copy & export — is at https://mozaika.design/effects/topology.

Library

Vanta.js · vanta@0.5.24 · MIT

https://github.com/tengbao/vanta

Install

npm i vanta three

Usage — the measured config

import p5 from 'p5';
import TOPOLOGY from 'vanta/dist/vanta.topology.min';

TOPOLOGY({ el: '#hero', p5, color: 0xff8c42, backgroundColor: 0xb0b12 });

Measured live

16fps · canvas 1440x900 · dark scheme

Agent-ready

MCP: get_recipe("Vanta.js", "Hero Effect") — the full config, params, fps and license/NOTICE in one call.