< Back to Frontend Friday Folks Index

Sunset

Highlighted solution (538 characters)
1 
<div class="b"></div>
2 
<div class="s"></div>
3 
<style>
4 
  body {
5 
    background: #1A4341;
6 
    display: grid;
7 
    place-items: center;
8 
  }
9 
  div {
10 
    background: linear-gradient(transparent 75px, #F3AC3C 0 95px, transparent 0 115px, #F3AC3C 0 135px, transparent 0 155px, #F3AC3C 0 175px, transparent 0);
11 
    border-radius: 50%;
12 
    position: absolute;
13 
    width: 250px;
14 
    height: 250px;
15 
  }
16 
  .s {
17 
    background: repeating-linear-gradient(#998235 0 30px, transparent 0 calc(100% - 30px));
18 
    width: 200px;
19 
    height: 200px;
20 
  }
21 
</style>
22
The repeating-linear-gradient is one character less than adding the color again.
< Back to Frontend Friday Folks Index