The Bridge

.theBridge {
  background:
      linear-gradient(227deg, #EBEBEB 0%, #C5C6C8 100%),
      linear-gradient(155deg, rgba(255,255,255,0.50) 5%, rgba(0,0,0,0.50) 100%);
  background-blend-mode: multiply;
}

Deep Focus

.deepFocus {
    background-image: linear-gradient(-180deg, #EBEBEB 0%, #DCDDDF 48%, #C4C5C7 99%);
}

Blue Hour

.blueHour {
    background: 
        linear-gradient(90deg, #7E898F 0%, #636C75 100%), 
        radial-gradient(at top, rgba(255, 255, 255, 0.50) 0%, rgba(0, 0, 0, 0.55) 100%), 
        radial-gradient(at top, rgba(255, 255, 255, 0.50) 0%, rgba(0, 0, 0, 0.08) 63%);
    background-blend-mode: multiply, screen;
}

Dark Amber

.darkAmber {
    background-image: linear-gradient(-180deg, #15140F 0%, #34312C 97%);
}

Prelude

.prelude {
background-image: radial-gradient(51% 96%, #E7E9E4 10%, #D4D6D1 96%);
}

Salt and Pepper

.saltAndPepper {
  background:  
    linear-gradient(-180deg, rgba(255, 255, 255, 0.50) 2%, rgba(0, 0, 0, 0.50) 100%),
    radial-gradient(51% 97%, #E8E8E8 7%, #CCCCCC 97%);
  background-blend-mode: multiply;
}

Cashmere

.cashemere {
  background-image: radial-gradient(51% 98%, #D3D4CF 7%, #BDBFBA 98%);
}

Wolverine

.wolverine {
  background:
    linear-gradient(90deg, #BDBFBA 4%, #5A5C5B 98%),
    linear-gradient(74deg, rgba(255,255,255,0.50) 54%, rgba(0,0,0,0.50) 100%);
  background-blend-mode: multiply;
}

Full Moon

.fullMoon {
    background-image:
    linear-gradient(#DEDFE3 2%, #AEB3B9 95%),
    radial-gradient(33% 100%, rgba(255,255,255,0.50) 0%, rgba(0,0,0,0.50) 100%);
    background-blend-mode: screen;
}

Flamingo

.flamingo {
    background-image: radial-gradient(73% 147%, #EADFDF 59%, #ECE2DF 100%),
    radial-gradient(91% 146%, rgba(255,255,255,0.50) 47%, rgba(0,0,0,0.50) 100%);
    background-blend-mode: screen;
}

Early Morning

.earlyMorning {
  background: 
      linear-gradient(-180deg, #BCC5CE 0%, #929EAD 98%),
      radial-gradient(at top left, rgba(255,255,255,0.30) 0%, rgba(0,0,0,0.30) 100%);
  background-blend-mode: screen;
}

Near Light

.nearLight {
  background-image: radial-gradient(at top right, #B7B6BB 0%, #E8EAE9 100%);
}

Leave a Reply