1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="utf-8" /> 5 <link rel="icon" href="data:,"> 6 <title>WebGL Rotating Teapot Demo</title> 7 <style> 8 body { 9 margin: 0; 10 color: #fff; 11 font: monospace; 12 background: #191919; 13 display: flex; 14 align-items: center; 15 justify-content: center; 16 } 17 canvas { 18 display: block; 19 } 20 21 #fps { 22 position: fixed; 23 top: 0; 24 left: 0; 25 margin: 5px; 26 } 27 28 @media (prefers-color-scheme: light) { 29 body { 30 color: #000; 31 background: #fff; 32 } 33 } 34 </style> 35 </head> 36 <body> 37 <canvas id="canvas"></canvas> 38 <div id="fps">0</div> 39 <script src="https://cdn.jsdelivr.net/npm/gl-matrix@3.4.3/gl-matrix-min.js"></script> 40 <script type="module" src="main.js"></script> 41 </body> 42 </html>
