Quark_,
https://css-tricks.com/examples/ShapesOfCSS/
кубик для сборки
<!DOCTYPE HTML>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<style type="text/css">
.test {
border: 10px solid;
border-color: blue;
position: relative;
width: 300px;
height: 200px;
}
#cone {
-webkit-transform: rotate(135deg);
-moz-transform: rotate(135deg);
-ms-transform: rotate(135deg);
-o-transform: rotate(135deg);
top:-38px;
left:-59px;
position: relative;
width: 0;
height: 0;
border-left: 70px solid transparent;
border-right: 70px solid transparent;
border-top: 100px solid blue;
-moz-border-radius: 50%;
-webkit-border-radius: 50%;
border-radius: 50%;
}
#cone:after{
content:"";
position: absolute;
top:-89px;
left:-64px;
width: 0;
height: 0;
border-left: 64px solid transparent;
border-right:64px solid transparent;
border-top: 90px solid #FFFFFF;
-moz-border-radius: 50%;
-webkit-border-radius: 50%;
border-radius: 50%;
}
</style>
</head>
<body>
<div class="test"><div id="cone"></div></div>
</body>
</html>