Sign in

How to realize the dynamic background of Apple Music Lyrics interface?

hllzh edited in Fri, 25 Nov 2022


As shown in the figure, in the background of Apple music lyrics on IOS 13, it is dynamic flow, and the main features are as follows: 1. The background color is selected according to the cover color, including multiple cover related colors; 2. The background flows freely like a fluid

I want to know, what is the implementation of this effect? What is the specific implementation principle?

1 Replies
commented on Fri, 25 Nov 2022

Simple version of the Gaussian blur plus animation, CSS can imitate. The complex version takes its background to make particle animation and then plays it, which can be done with canvas + JS. If you are not afraid of power consumption, you can use neural network + style transfer.

How to do it is up to apple.