Example
<svg xmlns="http://www.w3.org/2000/svg" width="800" height="800" viewBox="0 0 800 800"><defs><linearGradient id="skyDay" x1="0" x2="0" y1="0" y2="1"><stop offset="0%" stop-color="#ff5e62"/><stop offset="100%" stop-color="#ffb88c"/></linearGradient><linearGradient id="skySunset" x1="0" x2="0" y1="0" y2="1"><stop offset="0%" stop-color="#701243"/><stop offset="60%" stop-color="#d6314a"/><stop offset="100%" stop-color="#ff8933"/></linearGradient><linearGradient id="skyNight" x1="0" x2="0" y1="0" y2="1"><stop offset="0%" stop-color="#0b0f19"/><stop offset="60%" stop-color="#1a2245"/><stop offset="100%" stop-color="#3d2d59"/></linearGradient><linearGradient id="mtn1" x1="0" x2="0" y1="0" y2="1"><stop offset="0%" stop-color="#604066"/><stop offset="100%" stop-color="#2a1738"/></linearGradient><linearGradient id="mtn2" x1="0" x2="0" y1="0" y2="1"><stop offset="0%" stop-color="#41244e"/><stop offset="100%" stop-color="#180b24"/></linearGradient><linearGradient id="mtn3" x1="0" x2="0" y1="0" y2="1"><stop offset="0%" stop-color="#261233"/><stop offset="100%" stop-color="#0c0414"/></linearGradient><linearGradient id="ground" x1="0" x2="0" y1="0" y2="1"><stop offset="0%" stop-color="#12061a"/><stop offset="100%"/></linearGradient><radialGradient id="sunDay" cx="50%" cy="50%" r="50%"><stop offset="0%" stop-color="#fff"/><stop offset="30%" stop-color="#ffdf00"/><stop offset="100%" stop-color="#ff7b00"/></radialGradient><radialGradient id="sunNight" cx="50%" cy="50%" r="50%"><stop offset="0%" stop-color="#fda"/><stop offset="50%" stop-color="#ff4500"/><stop offset="100%" stop-color="#8b0000"/></radialGradient><radialGradient id="sunGlow" cx="50%" cy="50%" r="50%"><stop offset="0%" stop-color="rgba(255, 150, 50, 0.5)"/><stop offset="100%" stop-color="rgba(255, 150, 50, 0)"/></radialGradient><path id="pine" fill="#05010a" d="M-10-30h6l-4-25h6l-3-25 5-20 5 20-3 25h6L4-30h6L0 0Z"/><path id="bird" fill="#2a1738" d="M0 10Q10 0 20 8q10-8 20 2-10-6-20 2-10-8-20-2"/><g id="cloud-shape"><circle cx="50" cy="50" r="30"/><circle cx="90" cy="50" r="40"/><circle cx="130" cy="50" r="30"/><circle cx="90" cy="30" r="35"/><rect width="80" height="30" x="50" y="50" rx="15"/></g></defs><style>@keyframes sunsetOverlay{0%,15%,85%,to{opacity:0}45%,55%{opacity:.9}}@keyframes nightOverlay{0%,35%{opacity:0}80%,to{opacity:1}}@keyframes starCycle{0%,45%{opacity:0}85%,to{opacity:.8}}@keyframes sunTravel{0%,10%{transform:translate(400px,150px)}90%,to{transform:translate(400px,580px)}}@keyframes sunPulse{0%{transform:scale(.95);opacity:.6}to{transform:scale(1.1);opacity:.9}}@keyframes raySpin1{0%{transform:rotate(0deg)}to{transform:rotate(25deg)}}@keyframes raySpin2{0%{transform:rotate(0deg)}to{transform:rotate(-30deg)}}@keyframes twinkle{0%{transform:scale(.7);opacity:.3}to{transform:scale(1.3);opacity:1}}@keyframes cloudMove{0%{transform:translateX(-300px)}to{transform:translateX(1100px)}}@keyframes cloudMoveRev{0%{transform:translateX(1100px)}to{transform:translateX(-300px)}}@keyframes breath1{0%{transform:translateY(0)}to{transform:translateY(12px)}}@keyframes breath2{0%{transform:translateY(0)}to{transform:translateY(18px)}}@keyframes breath3{0%{transform:translateY(0)}to{transform:translateY(24px)}}@keyframes birdFly{0%{transform:translate(-150px,350px) scale(.6)}to{transform:translate(950px,200px) scale(.9)}}@keyframes birdFlap{0%{transform:scaleY(1)}to{transform:scaleY(-.4)}}@keyframes sway{0%{transform:rotate(-5deg)}to{transform:rotate(5deg)}}.sky-sunset{animation:sunsetOverlay 16s cubic-bezier(.3,.1,.7,.9) infinite alternate}.star{transform-origin:center;animation:twinkle 2s ease-in-out infinite alternate}.star.d1{animation-delay:-.4s;animation-duration:2.2s}.star.d2{animation-delay:-1.1s;animation-duration:1.8s}.star.d3{animation-delay:-1.7s;animation-duration:2.5s}.bird-sprite{transform-origin:20px 8px;animation:birdFlap .4s ease-in-out infinite alternate}.bird-sprite.d1{animation-delay:-.1s}.bird-sprite.d2{animation-delay:-.2s}.bird-sprite.d3{animation-delay:-.3s}.tree-sway{transform-origin:0 0;animation:sway 4s ease-in-out infinite alternate}.tree-sway.d1{animation-delay:-.8s;animation-duration:4.5s}.tree-sway.d2{animation-delay:-1.5s;animation-duration:3.7s}.tree-sway.d3{animation-delay:-2.2s;animation-duration:4.8s}</style><g id="background-sky"><rect width="100%" height="100%" fill="url(#skyDay)"/><rect width="100%" height="100%" fill="url(#skySunset)" class="sky-sunset"/><rect width="100%" height="100%" fill="url(#skyNight)" style="animation:nightOverlay 16s cubic-bezier(.3,.1,.7,.9) infinite alternate"/></g><g id="stars" style="animation:starCycle 16s cubic-bezier(.3,.1,.7,.9) infinite alternate"><circle cx="120" cy="50" r="1.5" fill="#fff" class="star d1"/><circle cx="250" cy="180" r="2" fill="#fff" class="star d2"/><circle cx="380" cy="80" r="1" fill="#fff" class="star d3"/><circle cx="500" cy="220" r="2" fill="#fff" class="star d1"/><circle cx="650" cy="60" r="1.5" fill="#fff" class="star d2"/><circle cx="780" cy="150" r="1" fill="#fff" class="star d3"/><circle cx="80" cy="250" r="2" fill="#fff" class="star d2"/><circle cx="420" cy="290" r="1" fill="#fff" class="star d1"/><circle cx="710" cy="240" r="1.5" fill="#fff" class="star d3"/><circle cx="580" cy="130" r="2" fill="#fff" class="star d1"/><circle cx="180" cy="110" r="1" fill="#fff" class="star d2"/><circle cx="310" cy="40" r="2" fill="#fff" class="star d3"/><circle cx="50" cy="130" r="1.5" fill="#fff" class="star d1"/><circle cx="210" cy="280" r="1" fill="#fff" class="star d3"/><circle cx="680" cy="310" r="2" fill="#fff" class="star d2"/><circle cx="850" cy="90" r="1.5" fill="#fff" class="star d1"/></g><g style="animation:sunTravel 16s cubic-bezier(.3,.1,.7,.9) infinite alternate"><circle r="220" fill="url(#sunGlow)" style="animation:sunPulse 3s ease-in-out infinite alternate;transform-origin:0 0"/><circle r="130" fill="none" stroke="rgba(255, 255, 255, 0.15)" stroke-dasharray="20 40" stroke-width="40" style="animation:raySpin1 12s ease-in-out infinite alternate;transform-origin:0 0"/><circle r="170" fill="none" stroke="rgba(255, 200, 100, 0.1)" stroke-dasharray="15 45" stroke-width="30" style="animation:raySpin2 14s ease-in-out infinite alternate;transform-origin:0 0"/><circle r="80" fill="url(#sunDay)"/><circle r="80" fill="url(#sunNight)" class="sky-sunset"/></g><use href="#cloud-shape" style="animation:cloudMove 45s linear infinite;opacity:.35;fill:#fff" transform="matrix(1.3 0 0 1.3 0 150)"/><use href="#cloud-shape" style="animation-duration:65s;animation-delay:-15s;opacity:.25;fill:#fff" transform="matrix(.9 0 0 .9 0 260)"/><use href="#cloud-shape" style="animation:cloudMoveRev 55s linear infinite;animation-delay:-10s;opacity:.3;fill:#fff" transform="matrix(1.6 0 0 1.6 0 90)"/><path fill="url(#mtn1)" d="M-50 450q150-100 250-30t200-40 200 50 250-70v490H-50Z" style="animation:breath1 8s ease-in-out infinite alternate"/><g style="animation:birdFly 22s linear infinite"><use class="bird-sprite" href="#bird"/><use class="bird-sprite d1" href="#bird" transform="matrix(.8 0 0 .8 -45 -25)"/><use class="bird-sprite d2" href="#bird" transform="matrix(.9 0 0 .9 -65 30)"/><use class="bird-sprite d3" href="#bird" transform="matrix(.7 0 0 .7 -100 5)"/></g><g style="animation-delay:-11s;animation-duration:26s"><use class="bird-sprite d2" href="#bird" transform="matrix(.7 0 0 .7 0 100)"/><use class="bird-sprite d3" href="#bird" transform="matrix(.56 0 0 .56 -35 128)"/><use class="bird-sprite d1" href="#bird" transform="matrix(.63 0 0 .63 -63 107)"/></g><path fill="url(#mtn2)" d="M-50 520q200-120 400-20t300-50 200 100v300H-50Z" style="animation:breath2 10s ease-in-out infinite alternate-reverse"/><path fill="url(#mtn3)" d="M-50 600q300-120 550 20t350-120v350H-50Z" style="animation:breath3 12s ease-in-out infinite alternate"/><g id="foreground"><path fill="url(#ground)" d="M-50 720q350-60 650 30t250-70v170H-50Z"/><use class="tree-sway d1" href="#pine" transform="matrix(1.4 0 0 1.4 60 700)"/><use class="tree-sway d2" href="#pine" transform="matrix(1.8 0 0 1.8 110 690)"/><use class="tree-sway d3" href="#pine" transform="matrix(1.2 0 0 1.2 170 682)"/><use class="tree-sway d1" href="#pine" transform="matrix(1.5 0 0 1.5 250 680)"/><use class="tree-sway d2" href="#pine" transform="matrix(1.3 0 0 1.3 350 690)"/><use class="tree-sway d3" href="#pine" transform="matrix(1.7 0 0 1.7 450 712)"/><use class="tree-sway d1" href="#pine" transform="matrix(2.2 0 0 2.2 580 745)"/><use class="tree-sway d2" href="#pine" transform="matrix(1.5 0 0 1.5 650 735)"/><use class="tree-sway d3" href="#pine" transform="matrix(1.6 0 0 1.6 730 715)"/></g></svg>