幾何学図形コラージュ装飾

<div class="geo07-08-01">
          <span class="shape circle c1"></span>
          <span class="shape circle c2"></span>
          <span class="shape circle c3"></span>
          <span class="shape square s1"></span>
          <span class="shape square s2"></span>
          <span class="shape triangle t1"></span>
          <span class="shape triangle t2"></span>
          <span class="shape ring"></span>
          <span class="shape bar"></span>
        </div>

.d07-08-01 .geo07-08-01{
          position:relative;
          width:220px;
          height:220px;
        }
        .d07-08-01 .shape{
          position:absolute;
          display:block;
        }
        .d07-08-01 .circle{
          border-radius:50%;
        }
        .d07-08-01 .c1{
          width:92px;
          height:92px;
          background:#2563eb;
          top:6px;
          left:14px;
          opacity:.92;
        }
        .d07-08-01 .c2{
          width:48px;
          height:48px;
          background:#f59e0b;
          bottom:14px;
          right:6px;
        }
        .d07-08-01 .c3{
          width:16px;
          height:16px;
          background:#0ea5e9;
          top:14px;
          right:40px;
        }
        .d07-08-01 .square{
          background:#10b981;
        }
        .d07-08-01 .s1{
          width:56px;
          height:56px;
          top:64px;
          right:22px;
          transform:rotate(15deg);
          background:#10b981;
        }
        .d07-08-01 .s2{
          width:30px;
          height:30px;
          bottom:36px;
          left:6px;
          transform:rotate(-12deg);
          background:#ef4444;
        }
        .d07-08-01 .triangle{
          width:0;
          height:0;
        }
        .d07-08-01 .t1{
          border-left:32px solid transparent;
          border-right:32px solid transparent;
          border-bottom:56px solid #8b5cf6;
          top:2px;
          right:56px;
        }
        .d07-08-01 .t2{
          border-left:18px solid transparent;
          border-right:18px solid transparent;
          border-bottom:30px solid #f472b6;
          bottom:4px;
          left:64px;
        }
        .d07-08-01 .ring{
          width:128px;
          height:128px;
          border:6px solid #f472b6;
          border-radius:50%;
          top:38px;
          left:46px;
          opacity:.45;
        }
        .d07-08-01 .bar{
          width:120px;
          height:12px;
          background:#1e293b;
          bottom:2px;
          left:40px;
          opacity:.75;
          transform:rotate(-4deg);
        }