Grokking CSS Design Patterns to Ace Interviews/

...

/

Solution: Animated Gradient Background

Solution: Animated Gradient Background

Let’s animate a full-screen gradient background that shifts smoothly through multiple colors using CSS keyframes.

We'll cover the following...

Problem description

Given an HTML page containing a <section class="gradient-bg"></section> element, write CSS to:

  • Apply a linear-gradient background with at least four distinct color stops. ...