Вот снимок кодов для разработки макета с использованием Three.js

// Настраиваем сцену, камеру и средство визуализации
var scene = new THREE.Scene();
var camera = new THREE.PerspectiveCamera( 75, window.innerWidth / window.innerHeight, 0.1, 1000 );
var renderer = new THREE.WebGLRenderer();
renderer.setSize( window.innerWidth, window.innerHeight );
document.body.appendChild( renderer.domElement );

// Создаем материалы для логотипа
var blueMaterial = new THREE.MeshBasicMaterial( { color: 0x00A1F1 } );
var redMaterial = new THREE.MeshBasicMaterial( { color: 0xF65314 } );
var yellowMaterial = new THREE.MeshBasicMaterial({color: 0xFDB813});
var greyMaterial = new THREE.MeshBasicMaterial({color: 0x737373});

// Создаем фигуры для логотипа
var rectShape = new THREE.Shape();
rectShape.moveTo(-50, -50);
rectShape.lineTo(50, -50) ;
rectShape.lineTo( 50, 50 );
rectShape.lineTo( -50, 50 );
rectShape.lineTo( -50, -50 );

var CircleShape = new THREE.Shape ();

var TriangleShape = new THREE.Shape();
треугольникShape.moveTo(-50, -50);
треугольникShape.lineTo( 50, -50); );
треугольникShape.lineTo(-50, -50);

// Создаем сетки логотипа
var blueRect = new THREE.Mesh( new THREE.ExtrudeGeometry( rectShape, { depth: 10 } ), blueMaterial );
var redRect = new THREE.Mesh( new THREE. ExtrudeGeometry( rectShape, { depth: 10 } ), redMaterial );
var yellowCircle = new THREE.Mesh( new THREE.ExtrudeGeometry( circleShape, { depth: 10 } ), yellowMaterial );
var greyTriangle = новый THREE.Mesh (новый THREE.ExtrudeGeometry (треугольная форма, {глубина: 10}), greyMaterial);

// Размещение мешей
blueRect.position.set(-75, 0, 0);
redRect.position.set(-25, 0, 0);
yellowCircle.position.set ( 25, 0, 0 );
greyTriangle.position.set( 75, 0, 0 );

// Добавляем сетки в сцену
scene.add( blueRect );
scene.add( redRect );
scene.add( yellowCircle );
scene.add( greyTriangle );

// Позиционируем камеру и визуализируем сцену
camera.position.z = 100;
renderer.render( scene, camera );

Попробовав это, оставляйте комментарии для любых улучшений.