404Lyrics

The idea

Spotify’s own Lyrics view gets one thing right: the sync is exact, because it comes from the same source Spotify itself uses. 404Lyrics keeps exactly that and rebuilds everything else. The active line sits at the centre of the screen, everything else recedes into a shallow depth of field with falling opacity, and the column glides so the current line always sits on the same reading position — on a background painted straight from the album art.

Colour and mood line up with kpop-theme, but it runs fine with any other Spotify theme too.

Word-by-word karaoke

When the option is on, the app asks Netease Cloud Music for real per-word timing (yrc or klyric) on the current track. When it has it, the active line fills word by word in time with the vocal — words already sung stay lit, the current one fills left to right, upcoming words stay muted.

Netease is only ever consulted for word timing; its own line-level lyrics are discarded so a possible timing offset can never displace Spotify’s exact line sync. The match is further gated on track duration (±4 seconds) — if that doesn’t line up, the line falls back to normal line-level sync. There is no invented word timing: without real data, the line-level experience stays exactly as it is.

An optional Karaoke Focus Mode narrows the view further: the active line jumps forward in size and contrast, the two neighbouring lines stay readable, everything else fades out, and the controls hide themselves.

Translation without an API key

A Spicetify custom app is plain frontend JavaScript, so a paid or keyed translation service would ship its key in every single install. 404Lyrics uses the same keyless endpoints browser translation extensions rely on instead, tried in a fixed order because each one is unofficial and independently rate-limited on its own. Every request goes through Spicetify.CosmosAsync, the only reliable way past the page’s CSP and browser CORS.

Translation is off by default — while it stays off, not a single request goes out. Every translated line is additionally cached locally, up to 4000 entries, so reopening the same track costs nothing more.

No build step

As with Zen Mode and Spicetify Stats, Spicetify loads the files directly — no npm, no bundler, no TypeScript, no JSX. React elements are built through a short h() helper around Spicetify.React.createElement.

Every track change gets a monotonically increasing token and its own AbortController; translation batches are tracked by a separate generation counter. Lyrics, cover colours, karaoke and translation results are only accepted while their token still matches — a late response for a track already skipped past can never overwrite what should be on screen.