#TB to this "pure CSS" animation I did on
@CodePen
for Codevember back in 2018. I learned a ton about SVG <clipPath> and clipPathUnits="objectBoundingBox" scaling for this.
codepen.io/xdesro/full/KrMGoy
"Pure CSS" is in quotes because while the entire vignette is comprised of <div>s styled with CSS, it uses a lot of
clip-path: url()
to reference some SVG clips.(The animation was based on this beautiful shot I found on Dribbble dribbble.com/shots/3106707-Setting-Sun)