CSS Battle #153 – Checkers

[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 {characters}</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 {characters}

your cssbattles code here!

[Narigo]

Oh, I have done this at the JSCraftCamp previously! Made a small improvement to the solution we did there. This was really nice for gradients 😅

Code Source – 606.33 {435}

<div></div>
<style>
  body {
    display: grid;
    place-items: center;
    background: #E3516E;
  }
  div {
    width: 200px;
    height: 200px;
    background:
      radial-gradient(circle at 60px 100px, #E3516E 10px, #0000 0) 0 0 / 80px 200px,
      radial-gradient(circle at 20px 20px, #FADE8B 10px, #0000 0) 0 0 / 40px 40px,
      conic-gradient(#E3516E 25%, #FADE8B 0 50%, #E3516E 0 75%, #FADE8B 0) 0 0 / 80px 80px;
  }
</style>