39 lines
1.5 KiB
HTML
39 lines
1.5 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en" >
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<title>CodePen - P5js SVG Flow Field</title>
|
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/5.0.0/normalize.min.css">
|
|
<link rel="stylesheet" href="./style.css">
|
|
|
|
</head>
|
|
<body>
|
|
<!-- partial:index.partial.html -->
|
|
<svg id="gradients" width="600" height="600" version="1.1" xmlns="http://www.w3.org/2000/svg">
|
|
<defs>
|
|
<linearGradient id="Gradient1" x1="0" x2="1" y1="0" y2="0">
|
|
<stop offset="0%" stop-color="#7d2cac"/>
|
|
<stop offset="100%" stop-color="transparent"/>
|
|
</linearGradient>
|
|
<linearGradient id="Gradient2" x1="0" x2="1" y1="0" y2="0">
|
|
<stop offset="0%" stop-color="transparent"/>
|
|
<stop offset="100%" stop-color="#5cbbdd"/>
|
|
</linearGradient>
|
|
<linearGradient gradientUnits="userSpaceOnUse" id="Gradient3" x1="0" x2="1" y1="0" y2="0">
|
|
<stop offset="-25%" stop-color="#5cbbdd"/>
|
|
<stop offset="50%" stop-color="transparent"/>
|
|
<stop offset="125%" stop-color="#5cbbdd"/>
|
|
</linearGradient>
|
|
<linearGradient id="Gradient4" x1="0" x2="1" y1="0" y2="0">
|
|
<stop offset="0%" stop-color="transparent"/>
|
|
<stop offset="100%" stop-color="#deb84d"/>
|
|
</linearGradient>
|
|
</defs>
|
|
</svg>
|
|
<!-- partial -->
|
|
<script src='https://cdnjs.cloudflare.com/ajax/libs/p5.js/1.4.0/p5.min.js'></script>
|
|
<script src='https://unpkg.com/p5.js-svg@1.1.1/dist/p5.svg.js'></script><script src="./script.js"></script>
|
|
|
|
</body>
|
|
</html>
|