|
|
<!DOCTYPE html> |
|
|
<html lang="en"> |
|
|
<head> |
|
|
<meta charset="UTF-8" /> |
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> |
|
|
<title>Fluid Dotted Mesh Bubble</title> |
|
|
<style> |
|
|
body { |
|
|
margin: 0; |
|
|
overflow: hidden; |
|
|
background: radial-gradient(circle at center, #0d0d2b, #000000); |
|
|
} |
|
|
canvas { |
|
|
display: block; |
|
|
} |
|
|
</style> |
|
|
<script type="importmap"> |
|
|
{ |
|
|
"imports": { |
|
|
"three": "https://cdn.jsdelivr.net/npm/[email protected]/build/three.module.js", |
|
|
"three/addons/": "https://cdn.jsdelivr.net/npm/[email protected]/examples/jsm/" |
|
|
} |
|
|
} |
|
|
</script> |
|
|
</head> |
|
|
<body> |
|
|
<canvas id="webgl"></canvas> |
|
|
<script type="module" src="./main.js"></script> |
|
|
</body> |
|
|
</html> |
