body {
display: flex;
align-items: center;
justify-content: center;
height: 100vh;
background: white;
}
canvas {
pointer-events: none;
}
View Compiled
var text = new Blotter.Text("Ants!", {
family : "serif",
size : 150,
fill : "black",
});
var material = new Blotter.FliesMaterial();
material.uniforms.uPointCellWidth.value = 0.01;
material.uniforms.uPointRadius.value = .8;
material.uniforms.uSpeed.value = 5;
var blotter = new Blotter(material, {
texts : text,
});
var scope = blotter.forText(text);
scope.appendTo(document.body);
This Pen doesn't use any external CSS resources.