JSFiddle - React, Tailwind, and code Playground

by joe_wretham

HTML

<!DOCTYPE html>
<script src="https://npmcdn.com/regl@1.3.0/dist/regl.js"></script>
<div id="div" width="400" height="300"></div>

JavaScript

var regl = createREGL();

var drawTriangle = regl({

  // fragment shader
  frag: `
precision mediump float;
uniform vec4 color;
void main () {
gl_FragColor = color;
}`,

  // vertex shader
  vert: `
precision mediump float;
attribute vec2 position;
void main () {
gl_Position = vec4(position, 0, 1);
}`,

  // attributes
  attributes: {
    position: [
      [-1, 0],
      [0, -1],
      [1, 1]
    ]
  },

  // uniforms
  uniforms: {
    color: [1, 0, 0, 1]
  },

  // vertex count
  count: 3
})

drawTriangle();