CSS Battle #72 – Sheep

[Narigo]

Link to battle:

Let's battle! ⚔️

Copy the code block below to format your comment on the discussion thread:

<details>
<summary>Code Source  – <strong>score {character count}</strong></summary>
<!-- have to be followed by an empty line! -->

```html
your cssbattles code here!
```

</details>

What others will see:

This will result in a nice hidden bit like so:

Code Source – score {character count}

your cssbattles code here!

[Narigo]

Code Source – 596.33 (99.9% match) {933}

<div>
<div>
<div></div>
</div>
</div>
<style>
  body {
    display:grid;place-items:center;background:#243D83
  }
  div {
    width: 140px;
    height: 140px;
    background: #6592CF;
    border-radius:35px;
    rotate:45deg;
  }
  body>div>div {
    scale: 0.96;
    width: 140px;
    height: 140px;
  }
  body>div>div>div {
    rotate:-90deg;
    background:
      radial-gradient(circle at 60px 55px,#6592CF 5px,#0000 0) 0 0 no-repeat,
      radial-gradient(circle at 80px 55px,#6592CF 5px,#0000 0) 0 0 no-repeat,
      radial-gradient(circle at 30px 30px,#6592CF 25px,#0000 0) 0 0 no-repeat,
      radial-gradient(circle at 110px 30px,#6592CF 25px,#0000 0) 0 0 no-repeat,
      radial-gradient(circle at 70px 10px,#6592CF 25px,#0000 0) 0 0 no-repeat,
      radial-gradient(circle at 70px 65px,#243D83 31px,#0000 0) 0 0 no-repeat,
      linear-gradient(to bottom,#243D83 50px,#0000 0) 50% 10px / 60px no-repeat
    ;
  }
</style>

[david-001]

Code Source – 590.13 (99.6% match) {1034}

<div a><div b></div><div c></div><div d></div></div>
<style>
  body{
    margin:0;
    background: #243D83;
    display:flex;
    justify-content: center;
    align-items: center;
  }
  [a]{
    width: 135px;
    height: 135px;
    background: #6592CF;
    border-radius: 30px;
    position: relative;
  }
  [b] {
    position: absolute;
    top:0;
    left:0;
    width: 135px;
    height: 135px;
    background: #6592CF;
    border-radius: 30px;
    rotate: 45deg;
  }
  [c]{
    position: absolute;
    top:30;
    left:37;
    width: 60px;
    height: 60px;
    background: #243D83;
    border-radius: 28px;
  }
  [d]{
    position: absolute;
    top:20;
    left:37;
    width: 60px;
    height: 70px;
    background: radial-gradient(circle at 20px 33px, #6592CF 5px, #0000 0),radial-gradient(circle at 40px 33px, #6592CF 5px, #0000 0),radial-gradient(circle at -5px 5px, #6592CF 25px, #0000 0),radial-gradient(circle at 65px 5px, #6592CF 25px, #0000 0),radial-gradient(circle at 30px -12px, #6592CF 25px, #0000 0);
  }
</style>