抽象的球CSS代码

<style>
    * {
        margin: 0;
    }
    #wrapper {
        position: relative;
        left: 400px;
        top: 200px;
    }
    .main1 {
        
    }
    .main2 {
        transform: rotate(30deg);
    }
    .main3 {
        transform: rotate(60deg);
    }
    .main4 {
        transform: rotate(90deg);
    }
    .main5 {
        transform: rotate(120deg);
    }
     .main6 {
        transform: rotate(150deg);
    }
     .main7 {
        transform: rotate(180deg);
    }
     .main8 {
        transform: rotate(210deg);
    }
     .main9 {
        transform: rotate(240deg);
    }
      .main10 {
        transform: rotate(270deg);
    }
      .main11 {
        transform: rotate(300deg);
    }
      .main12 {
        transform: rotate(330deg);
    }

     .main51 {
        transform: rotate(60deg);
    }
     .main52 {
        transform: rotate(120deg);
    }
     .main53 {
        transform: rotate(180deg);
    }
     .main54 {
        transform: rotate(240deg);
    }
     .main55 {
        transform: rotate(300deg);
    }
     .main56 {
        transform: rotate(360deg);
    }
    .tool {
        width: 0px;
        height: 0px;
        border-right: 40px solid transparent;
        border-left: 40px solid transparent;
        border-bottom: 300px solid blue;
        position: absolute;
        top: 10;
        left: 0;
    }

 .too2 {
        width: 0px;
        height: 0px;
        border-right:10px solid transparent;
        border-left: 10px solid transparent;
        border-bottom: 80px solid red;
        position: absolute;
        top: 100;
        left: 30;
    }

</style>
<div id="wrapper">
    <div class="tool main1"></div>  
    <div class="tool main2"></div>
    <div class="tool main3"></div>
    <div class="tool main4"></div>
    <div class="tool main5"></div>
    <div class="tool main6"></div>
    <div class="tool main7"></div>
    <div class="tool main8"></div>
    <div class="tool main9"></div>
    <div class="tool main10"></div>
    <div class="tool main11"></div>
    <div class="tool main12"></div>

    <div class="too2 main51"></div>
    <div class="too2 main52"></div>
    <div class="too2 main53"></div>
    <div class="too2 main54"></div>
    <div class="too2 main55"></div>
    <div class="too2 main55"></div>
</div>