var scene = new THREE.Scene();

var aspect = window.innerWidth / window.innerHeight;

var camera = new THREE.PerspectiveCamera( 70, 1, 0.1, 1000 );

var windowCamera = new THREE.PerspectiveCamera( 70, aspect, 0.1, 1000 );

var d=0, t=0;

hemiLight = new THREE.HemisphereLight( 0xffff00, 0xffffff, .99 );

hemiLight.color.setRGB( 1,.5,.5 );

hemiLight.groundColor.setRGB( 1,.7,.5 );

hemiLight.position.set( 0, 1, 0 );

scene.add( hemiLight );

var renderer = new THREE.WebGLRenderer({antialias: true});

renderer.setSize( window.innerWidth, window.innerHeight );

document.body.appendChild( renderer.domElement );

var geometry = new THREE.Geometry();

geometry.vertices.push(new THREE.Vector3( 0,  0, 0 ));

f=12

r=20

for(i=0; i<f; i++){

  z=Math.random()*1.2

  a=((2*Math.PI)/f)*i

  geometry.vertices.push(new THREE.Vector3( Math.sin(a)*r, Math.cos(a)*r, z ));

}

for(i=1; i<=f; i++){

geometry.faces.push( new THREE.Face3( 0, i, i-1) );

}

geometry.faces.push( new THREE.Face3( 0, 1, f ) );

geometry.dynamic = true;

var material = new THREE.MeshPhongMaterial( { color: 0xffffff, specular: 0xffffff, shininess: 100, morphTargets: true, vertexColors: THREE.FaceColors, shading: THREE.FlatShading } );

var mesh = new THREE.Mesh( geometry, material );

material.side = THREE.BackSide;

material.side = THREE.DoubleSide;

material.blending =THREE.AdditiveBlending;

material.transparent=true;

material.opacity=.1;

html, body { margin: 0; padding: 0; overflow: hidden; }

<script src="//cdnjs.cloudflare.com/ajax/libs/three.js/r75/three.min.js"></script>