276 lines
11 KiB
HTML
276 lines
11 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en" >
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<title>CodePen - Generative Canyons</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 -->
|
|
<div id='wrap'>
|
|
<div class='box'>
|
|
<div class='row'>
|
|
<div class='hill'></div>
|
|
</div>
|
|
<div class='row'>
|
|
<div class='hill'></div>
|
|
</div>
|
|
<div class='row'>
|
|
<div class='hill'></div>
|
|
</div>
|
|
<div class='row'>
|
|
<div class='hill'></div>
|
|
</div>
|
|
<div class='row'>
|
|
<div class='hill'></div>
|
|
</div>
|
|
</div>
|
|
<div class='box'>
|
|
<div class='row'>
|
|
<div class='hill'></div>
|
|
</div>
|
|
<div class='row'>
|
|
<div class='hill'></div>
|
|
</div>
|
|
<div class='row'>
|
|
<div class='hill'></div>
|
|
</div>
|
|
<div class='row'>
|
|
<div class='hill'></div>
|
|
</div>
|
|
<div class='row'>
|
|
<div class='hill'></div>
|
|
</div>
|
|
</div>
|
|
<div class='box'>
|
|
<div class='row'>
|
|
<div class='hill'></div>
|
|
</div>
|
|
<div class='row'>
|
|
<div class='hill'></div>
|
|
</div>
|
|
<div class='row'>
|
|
<div class='hill'></div>
|
|
</div>
|
|
<div class='row'>
|
|
<div class='hill'></div>
|
|
</div>
|
|
<div class='row'>
|
|
<div class='hill'></div>
|
|
</div>
|
|
</div>
|
|
<div class='box'>
|
|
<div class='row'>
|
|
<div class='hill'></div>
|
|
</div>
|
|
<div class='row'>
|
|
<div class='hill'></div>
|
|
</div>
|
|
<div class='row'>
|
|
<div class='hill'></div>
|
|
</div>
|
|
<div class='row'>
|
|
<div class='hill'></div>
|
|
</div>
|
|
<div class='row'>
|
|
<div class='hill'></div>
|
|
</div>
|
|
</div>
|
|
<div class='box'>
|
|
<div class='row'>
|
|
<div class='hill'></div>
|
|
</div>
|
|
<div class='row'>
|
|
<div class='hill'></div>
|
|
</div>
|
|
<div class='row'>
|
|
<div class='hill'></div>
|
|
</div>
|
|
<div class='row'>
|
|
<div class='hill'></div>
|
|
</div>
|
|
<div class='row'>
|
|
<div class='hill'></div>
|
|
</div>
|
|
</div>
|
|
<div class='box'>
|
|
<div class='row'>
|
|
<div class='hill'></div>
|
|
</div>
|
|
<div class='row'>
|
|
<div class='hill'></div>
|
|
</div>
|
|
<div class='row'>
|
|
<div class='hill'></div>
|
|
</div>
|
|
<div class='row'>
|
|
<div class='hill'></div>
|
|
</div>
|
|
<div class='row'>
|
|
<div class='hill'></div>
|
|
</div>
|
|
</div>
|
|
<div class='box'>
|
|
<div class='row'>
|
|
<div class='hill'></div>
|
|
</div>
|
|
<div class='row'>
|
|
<div class='hill'></div>
|
|
</div>
|
|
<div class='row'>
|
|
<div class='hill'></div>
|
|
</div>
|
|
<div class='row'>
|
|
<div class='hill'></div>
|
|
</div>
|
|
<div class='row'>
|
|
<div class='hill'></div>
|
|
</div>
|
|
</div>
|
|
<div class='box'>
|
|
<div class='row'>
|
|
<div class='hill'></div>
|
|
</div>
|
|
<div class='row'>
|
|
<div class='hill'></div>
|
|
</div>
|
|
<div class='row'>
|
|
<div class='hill'></div>
|
|
</div>
|
|
<div class='row'>
|
|
<div class='hill'></div>
|
|
</div>
|
|
<div class='row'>
|
|
<div class='hill'></div>
|
|
</div>
|
|
</div>
|
|
<div class='box'>
|
|
<div class='row'>
|
|
<div class='hill'></div>
|
|
</div>
|
|
<div class='row'>
|
|
<div class='hill'></div>
|
|
</div>
|
|
<div class='row'>
|
|
<div class='hill'></div>
|
|
</div>
|
|
<div class='row'>
|
|
<div class='hill'></div>
|
|
</div>
|
|
<div class='row'>
|
|
<div class='hill'></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<svg version='1.1' xmlns='http://www.w3.org/2000/svg'>
|
|
<defs>
|
|
<filter class='filter' id='filter1'>
|
|
<feturbulence basefrequency='0.025 0.0015' id='frequency1' numoctaves='1' result='noise' seed='1' type='fractalNoise'></feturbulence>
|
|
<fedisplacementmap id='displacement1' in2='fractalNoise' in='SourceGraphic' scale='300'></fedisplacementmap>
|
|
</filter>
|
|
<filter class='filter' id='filter2'>
|
|
<feturbulence basefrequency='0.025 0.0015' id='frequency2' numoctaves='1' result='noise' seed='1' type='fractalNoise'></feturbulence>
|
|
<fedisplacementmap id='displacement2' in2='fractalNoise' in='SourceGraphic' scale='300'></fedisplacementmap>
|
|
</filter>
|
|
<filter class='filter' id='filter3'>
|
|
<feturbulence basefrequency='0.025 0.0015' id='frequency3' numoctaves='1' result='noise' seed='1' type='fractalNoise'></feturbulence>
|
|
<fedisplacementmap id='displacement3' in2='fractalNoise' in='SourceGraphic' scale='300'></fedisplacementmap>
|
|
</filter>
|
|
<filter class='filter' id='filter4'>
|
|
<feturbulence basefrequency='0.025 0.0015' id='frequency4' numoctaves='1' result='noise' seed='1' type='fractalNoise'></feturbulence>
|
|
<fedisplacementmap id='displacement4' in2='fractalNoise' in='SourceGraphic' scale='300'></fedisplacementmap>
|
|
</filter>
|
|
<filter class='filter' id='filter5'>
|
|
<feturbulence basefrequency='0.025 0.0015' id='frequency5' numoctaves='1' result='noise' seed='1' type='fractalNoise'></feturbulence>
|
|
<fedisplacementmap id='displacement5' in2='fractalNoise' in='SourceGraphic' scale='300'></fedisplacementmap>
|
|
</filter>
|
|
<filter class='filter' id='filter6'>
|
|
<feturbulence basefrequency='0.025 0.0015' id='frequency6' numoctaves='1' result='noise' seed='1' type='fractalNoise'></feturbulence>
|
|
<fedisplacementmap id='displacement6' in2='fractalNoise' in='SourceGraphic' scale='300'></fedisplacementmap>
|
|
</filter>
|
|
<filter class='filter' id='filter7'>
|
|
<feturbulence basefrequency='0.025 0.0015' id='frequency7' numoctaves='1' result='noise' seed='1' type='fractalNoise'></feturbulence>
|
|
<fedisplacementmap id='displacement7' in2='fractalNoise' in='SourceGraphic' scale='300'></fedisplacementmap>
|
|
</filter>
|
|
<filter class='filter' id='filter8'>
|
|
<feturbulence basefrequency='0.025 0.0015' id='frequency8' numoctaves='1' result='noise' seed='1' type='fractalNoise'></feturbulence>
|
|
<fedisplacementmap id='displacement8' in2='fractalNoise' in='SourceGraphic' scale='300'></fedisplacementmap>
|
|
</filter>
|
|
<filter class='filter' id='filter9'>
|
|
<feturbulence basefrequency='0.025 0.0015' id='frequency9' numoctaves='1' result='noise' seed='1' type='fractalNoise'></feturbulence>
|
|
<fedisplacementmap id='displacement9' in2='fractalNoise' in='SourceGraphic' scale='300'></fedisplacementmap>
|
|
</filter>
|
|
<filter class='filter' id='filter10'>
|
|
<feturbulence basefrequency='0.025 0.0015' id='frequency10' numoctaves='1' result='noise' seed='1' type='fractalNoise'></feturbulence>
|
|
<fedisplacementmap id='displacement10' in2='fractalNoise' in='SourceGraphic' scale='300'></fedisplacementmap>
|
|
</filter>
|
|
<filter class='filter' id='filter11'>
|
|
<feturbulence basefrequency='0.025 0.0015' id='frequency11' numoctaves='1' result='noise' seed='1' type='fractalNoise'></feturbulence>
|
|
<fedisplacementmap id='displacement11' in2='fractalNoise' in='SourceGraphic' scale='300'></fedisplacementmap>
|
|
</filter>
|
|
<filter class='filter' id='filter12'>
|
|
<feturbulence basefrequency='0.025 0.0015' id='frequency12' numoctaves='1' result='noise' seed='1' type='fractalNoise'></feturbulence>
|
|
<fedisplacementmap id='displacement12' in2='fractalNoise' in='SourceGraphic' scale='300'></fedisplacementmap>
|
|
</filter>
|
|
<filter class='filter' id='filter13'>
|
|
<feturbulence basefrequency='0.025 0.0015' id='frequency13' numoctaves='1' result='noise' seed='1' type='fractalNoise'></feturbulence>
|
|
<fedisplacementmap id='displacement13' in2='fractalNoise' in='SourceGraphic' scale='300'></fedisplacementmap>
|
|
</filter>
|
|
<filter class='filter' id='filter14'>
|
|
<feturbulence basefrequency='0.025 0.0015' id='frequency14' numoctaves='1' result='noise' seed='1' type='fractalNoise'></feturbulence>
|
|
<fedisplacementmap id='displacement14' in2='fractalNoise' in='SourceGraphic' scale='300'></fedisplacementmap>
|
|
</filter>
|
|
<filter class='filter' id='filter15'>
|
|
<feturbulence basefrequency='0.025 0.0015' id='frequency15' numoctaves='1' result='noise' seed='1' type='fractalNoise'></feturbulence>
|
|
<fedisplacementmap id='displacement15' in2='fractalNoise' in='SourceGraphic' scale='300'></fedisplacementmap>
|
|
</filter>
|
|
<filter class='filter' id='filter16'>
|
|
<feturbulence basefrequency='0.025 0.0015' id='frequency16' numoctaves='1' result='noise' seed='1' type='fractalNoise'></feturbulence>
|
|
<fedisplacementmap id='displacement16' in2='fractalNoise' in='SourceGraphic' scale='300'></fedisplacementmap>
|
|
</filter>
|
|
<filter class='filter' id='filter17'>
|
|
<feturbulence basefrequency='0.025 0.0015' id='frequency17' numoctaves='1' result='noise' seed='1' type='fractalNoise'></feturbulence>
|
|
<fedisplacementmap id='displacement17' in2='fractalNoise' in='SourceGraphic' scale='300'></fedisplacementmap>
|
|
</filter>
|
|
<filter class='filter' id='filter18'>
|
|
<feturbulence basefrequency='0.025 0.0015' id='frequency18' numoctaves='1' result='noise' seed='1' type='fractalNoise'></feturbulence>
|
|
<fedisplacementmap id='displacement18' in2='fractalNoise' in='SourceGraphic' scale='300'></fedisplacementmap>
|
|
</filter>
|
|
<filter class='filter' id='filter19'>
|
|
<feturbulence basefrequency='0.025 0.0015' id='frequency19' numoctaves='1' result='noise' seed='1' type='fractalNoise'></feturbulence>
|
|
<fedisplacementmap id='displacement19' in2='fractalNoise' in='SourceGraphic' scale='300'></fedisplacementmap>
|
|
</filter>
|
|
<filter class='filter' id='filter20'>
|
|
<feturbulence basefrequency='0.025 0.0015' id='frequency20' numoctaves='1' result='noise' seed='1' type='fractalNoise'></feturbulence>
|
|
<fedisplacementmap id='displacement20' in2='fractalNoise' in='SourceGraphic' scale='300'></fedisplacementmap>
|
|
</filter>
|
|
<filter class='filter' id='filter21'>
|
|
<feturbulence basefrequency='0.025 0.0015' id='frequency21' numoctaves='1' result='noise' seed='1' type='fractalNoise'></feturbulence>
|
|
<fedisplacementmap id='displacement21' in2='fractalNoise' in='SourceGraphic' scale='300'></fedisplacementmap>
|
|
</filter>
|
|
<filter class='filter' id='filter22'>
|
|
<feturbulence basefrequency='0.025 0.0015' id='frequency22' numoctaves='1' result='noise' seed='1' type='fractalNoise'></feturbulence>
|
|
<fedisplacementmap id='displacement22' in2='fractalNoise' in='SourceGraphic' scale='300'></fedisplacementmap>
|
|
</filter>
|
|
<filter class='filter' id='filter23'>
|
|
<feturbulence basefrequency='0.025 0.0015' id='frequency23' numoctaves='1' result='noise' seed='1' type='fractalNoise'></feturbulence>
|
|
<fedisplacementmap id='displacement23' in2='fractalNoise' in='SourceGraphic' scale='300'></fedisplacementmap>
|
|
</filter>
|
|
<filter class='filter' id='filter24'>
|
|
<feturbulence basefrequency='0.025 0.0015' id='frequency24' numoctaves='1' result='noise' seed='1' type='fractalNoise'></feturbulence>
|
|
<fedisplacementmap id='displacement24' in2='fractalNoise' in='SourceGraphic' scale='300'></fedisplacementmap>
|
|
</filter>
|
|
<filter class='filter' id='filter25'>
|
|
<feturbulence basefrequency='0.025 0.0015' id='frequency25' numoctaves='1' result='noise' seed='1' type='fractalNoise'></feturbulence>
|
|
<fedisplacementmap id='displacement25' in2='fractalNoise' in='SourceGraphic' scale='300'></fedisplacementmap>
|
|
</filter>
|
|
</defs>
|
|
</svg>
|
|
<!-- partial -->
|
|
<script src="./script.js"></script>
|
|
|
|
</body>
|
|
</html>
|