3d - Curved plane surface in CSS3 or Three.js? -

how can create curved plane surface (like 1 pictured) using css3 or three.js?

var width = 100, height = 100, width_segments =1, height_segments = 100; var plane = new three.planegeometry(width, height, width_segments, height_segments);  for(var i=0; i<plane.vertices.length/2; i++) {     plane.vertices[2*i].position.z = math.pow(2, i/20);     plane.vertices[2*i+1].position.z = math.pow(2, i/20); }  var mesh = new three.mesh(plane, new three.meshlambertmaterial({color: 0x888888})); mesh.doublesided = true; mesh.rotation.y = math.pi/2-0.5; scene.add(mesh); 

you create geometry, , displace it's vertices way to. creating curved surface use 'sin' or 'cos' functions, or exponential, showed. hope helps.