Colour Wheel 3d Interactive - Explore and Discover | Art

Instructions

Gear button to adjust settings. Spin button (or <space>) to go for a spin. Magnifying glass to explore the colour beads. Use the mouse to stop, move and spin the wheel. Change Width x Height for more colours Whilst you're here why not check out: Science: https://scratch.mit.edu/studios/26831275/ Games: https://scratch.mit.edu/studios/27050111/ #3d #colour #color

Notes and Credits

Who knew that brown was simply a shade of orange? Explore and understand the colour, saturation and brightness wheel. Find the perfect football pitch green, mud brown, pastel shade or skin tone. Still can't find the colour you're looking for, try exploring in TurboWarp: https://turbowarp.org/468394941/ Colour: 0° Red, 60° Yellow, 120° Green, 180° Cyan, 240° Blue, 300° Magenta Saturation: Outside 100%, Centre 0% Brightness: Front 100%, Back 0% Tints are created by adding white to a colour. Tints are found along the lines from the outside to the centre of the wheel. Shades are created by adding black to a colour. Shades are found along the lines from the front to the back of the wheel. Tones are created by adding grey to a colour. Tones are found along the diagonal lines of the wheel. 13 3d vectors are created. 1 for the direction of the axle, and 1 for the direction of each of the 12 spokes. Each update the vectors are transformed (scaled, rotated) to their current size, direction. 3d points are calculated using the transformed vectors and projected onto the 2d screen. The points at the back of the wheel are drawn first so the points at the front appear on top. See HSV colour cylinder https://en.wikipedia.org/wiki/HSL_and_HSV https://en.wikipedia.org/wiki/Tints_and_shades Transformation Matrix https://en.wikipedia.org/wiki/Transformation_matrix The 2d screen coordinates can be found using the properties of similar triangles. See: https://en.m.wikipedia.org/wiki/3D_projection#Diagram Bx=Ax*Bz/Az where Bx is the screen x coordinate Ax is the model x coordinate Bz is the focal length: the distance on the z axis from the camera to the screen. Az is the subject distance: the distance on the z axis from the camera to the model z coordinate.