< Back to Frontend Friday Folks Index

Spiral

Visit the official puzzle page (affiliate link!) to play it yourself. If you buy a course from CSSBattle through my affiliate link, I receive a share of it!

Highlighted solution (407 characters)
1 
<style>
2 
  &{
3 
    background:
4 
      radial-gradient(1q at 170px 50%, #D86F45 10px,#3210 0),
5 
      radial-gradient(1q at 90px 50%, #D86F45 10px,#3210 0),
6 
      radial-gradient(1q at 180px 0,#F5D6B4 40px,#D86F45 0 60px,#F5D6B4 0 80px,#D86F45 0 100px,#F5D6B4 0) 0 100% / 100% 50% no-repeat,
7 
      radial-gradient(1q at 50% 100%,#F5D6B4 20px,#D86F45 0 40px,#F5D6B4 0 60px,#D86F45 0 80px,#F5D6B4 0) 0 0 / 100% 50%

It looked harder than it was - basically, there are circles cut in half and moved a bit to a side.

< Back to Frontend Friday Folks Index