This is an old revision of the document!
2D and 3D shapes can exhibit different colors. And just like the other transformations, adding color to a shape produces a new shape, one with color.
color([r,g,b], object, object2 ...); // for example, color([1,1,0],sphere()); color([r,g,b], array); color([r,g,b,a], object, object2 ...); color([r,g,b,a], array); color(name, object, object2 ...); // for example, color('red',sphere()); color(name, a, object, object2 ...); // for example, color('red',0.5, sphere()); color(name, array); color(name, a, array);
Whereas the named colors are case-insensitive, e.g. 'RED' is the same as 'red'.
using CSG objects' built in methods (r, g, b must be between 0 and 1, not 0 and 255):
object.setColor([r,g,b]); object.setColor([r,g,b,a]); object.setColor(r,g,b); object.setColor(r,g,b,a); object.setColor(css2rgb('dodgerblue'));
Examples:
color([1,0.5,0.3],sphere(1)); // openscad like color([1,0.5,0.3],sphere(1),cube(2)); color("Red",sphere(),cube().translate([2,0,0])); // named color (case-insensitive) sphere().setColor(1,0.5,0.3); // built in methods sphere().setColor([1,0.5,0.3]);
See the [https://www.w3.org/TR/css3-color/#svg-color Extended Color Keywords] for all available colors.
Code excerpt:
o.push( color([1,0,0],sphere()) ); o.push( color([0,1,0],cube()) ); o.push( color([0,0,1],cylinder()) ); o.push( color("red",sphere()) ); o.push( color("green", cube()) ); o.push( color("blue", cylinder()) ); for(var i=0; i<1; i+=1/12) { o.push( cube().setColor(hsl2rgb(i,1,0.5)) ); }
Code:
function main() { var o = []; for(var i=0; i<8; i++) { o.push(cylinder({r:3,h:20}). setColor( hsl2rgb(i/8,1,0.5). // hsl to rgb, creating rainbow [r,g,b] concat(1/8+i/8) // and add to alpha to make it [r,g,b,a] ).translate([(i-3)*7.5,0,0]) ); } o.push(color("red",cube(5)).translate([-4,-10,0])); o.push(color("red",0.5,cube(5)).translate([4,-10,0])); return o; }
Note: There are some Transparency_Sorting|OpenGL Transparency Limitations, e.g. and depending on the order of colors, you might not see through otherwise partially transparent objects.
Following functions to convert between color spaces.
var hsl = rgb2hsl(r,g,b); // or rgb2hsl([r,g,b]); var rgb = hsl2rgb(h,s,l); // or hsl2rgb([h,s,l]); var hsv = rgb2hsv(r,g,b); // or rgb2hsv([r,g,b]); var rgb = hsv2rgb(h,s,v); // or hsv2rgb([h,s,v]);
whereas
E.g. to create a rainbow, t = 0..1 and .setColor(hsl2rgb(t,1,0.5))
See the http://openjscad.org/#examples/slices/tor.jscad Tor (multi-color) for an example.