← Three.jsShader Uniforms

Color

import kleur from "@driangle/kleur";
import * as THREE from "three";

const color = kleur("#3a6bd5");
const [r, g, b, a] = color.toNormalized();
// => [0.2275, 0.4196,
//     0.8353, 1.0000]

material.uniforms.uColor = {
  value: new THREE.Vector4(r, g, b, a),
};

// GLSL usage:
// uniform vec4 uColor;
// gl_FragColor = uColor;

#3a6bd5

toNormalized() → vec4

r

0.2275

g

0.4196

b

0.8353

a

1.0000

GLSL

uniform vec4 uColor;
// vec4(0.2275, 0.4196, 0.8353, 1.0000)