Fragment shaders use RGBA color for describing color: each pixel has a Red, Green, Blue and Alpha (opacity) value which when combined can represent any visible colour.
In GLSL colours are represented as vectors:
vec2(brightness, alpha)
vec3(red, green, blue)
vec4(red, green, blue, alpha)
For example:
Combine red and green to get yellow.
Combine green and blue to get cyan.
Combine red and blue to get magenta.
GLSL vectors are a special type of array where each of the 2–4 values is a number. Vectors in GLSL are first-class citizens, and using them correctly is key to making the most of GLSL's potential. More on that later...
{"bannedTokens":[],"prefix":"uniform vec2 iResolution;\n","suffix":"float aastep(float threshold, float value) {\n #ifdef GL_OES_standard_derivatives\n float afwidth = length(vec2(dFdx(value), dFdy(value))) * 0.70710678118654757;\n return smoothstep(threshold-afwidth, threshold+afwidth, value);\n #else\n return step(threshold, value);\n #endif\n}\n\n#define PI 3.14159265359\nvec2 rt (float r, float a) {\n a *= PI * 2.0;\n return r * vec2(sin(a), cos(a));\n}\n\nvec2 squareFrame(vec2 screenSize, vec2 coord) {\n vec2 position = 2.0 * (coord.xy / screenSize.xy) - 1.0;\n if (screenSize.x > screenSize.y) {\n position.x *= screenSize.x / screenSize.y;\n } else {\n position.y *= screenSize.y / screenSize.x;\n }\n return position;\n}\n\nvoid main() {\n vec3 color = vec3(0.025, 0.05, 0.1);\n vec2 p = squareFrame(iResolution, gl_FragCoord.xy);\n\n color = mix(color, red, aastep(0.0, 0.1 - length(p - rt(0.5, 1.0 / 3.0))));\n color = mix(color, green, aastep(0.0, 0.1 - length(p - rt(0.5, 2.0 / 3.0))));\n color = mix(color, blue, aastep(0.0, 0.1 - length(p - rt(0.5, 3.0 / 3.0))));\n\n color = mix(color, yellow, aastep(0.0, 0.125 - length(p - rt(0.5, 1.5 / 3.0))));\n color = mix(color, cyan, aastep(0.0, 0.125 - length(p - rt(0.5, 2.5 / 3.0))));\n color = mix(color, magenta, aastep(0.0, 0.125 - length(p - rt(0.5, 3.5 / 3.0))));\n\n color = mix(color, white, aastep(0.0, 0.25 - length(p)));\n\n gl_FragColor = vec4(color, 1);\n}\n","question":"//\n// Fix the color variables listed here so that their\n// values match their name.\n//\n// You should only need a combination of 0s and 1s :)\n//\n\nvec3 red = vec3(1, 1, 1);\nvec3 green = vec3(1, 1, 1);\nvec3 blue = vec3(1, 1, 1);\nvec3 cyan = vec3(1, 1, 1);\nvec3 magenta = vec3(1, 1, 1);\nvec3 yellow = vec3(1, 1, 1);\nvec3 white = vec3(1, 1, 1);\n","solution":"vec3 red = vec3(1, 0, 0);\nvec3 green = vec3(0, 1, 0);\nvec3 blue = vec3(0, 0, 1);\nvec3 cyan = vec3(0, 1, 1);\nvec3 magenta = vec3(1, 0, 1);\nvec3 yellow = vec3(1, 1, 0);\nvec3 white = vec3(1, 1, 1);\n","name":"03-rgb"}