Awesome
Lyrics for Spotify
The browser extension adds a button to the bottom left corner of Spotify Web Player, Click to switch the display status of the lyrics, which is displayed in the Picture-in-Picture window by default setting. Spotify can be installed as pwa instead of desktop client.
If you have any questions, please submit an issue.
Install
- Chrome/Chromium/Firefox: Download the zip on the release page, and then load the extension on the extension management page of the browser. reason.
- Safari(Soon)
Features
-
Instant synchronized lyrics display
-
Lyrics style setting(Right Click)
-
Lyrics editor and upload(Ctrl + Right Click)
-
Experimental support Youtube Music, Apple Music, Deezer and Tidal
How To Work
- Listen for track info element.
- Search for songs and download lyrics using
NeteaseCloudMusicApi
. - Rendering lyrics to
<canvas>
. - Capture video stream from
<canvas>
and merge cover image. - Update lyrics scroll position with a loop.
Compatibility
Development
Requirement: Node.js
# install dependencies
yarn
# start develop
yarn run start
# optional: start firebase function simulation
yarn run start:firebase
Build:
yarn run build:zip
# firebase deploy and config update
# npm i -g firebase-tools
firebase deploy
firebase functions:config:get
firebase functions:config:set spotify-lyrics.manager-ids=xxx
Match Success Rate
Spotify, v1.2.7, Friday, July 31, 2020
Playlist Name | Success rate | Success | No Match | No Lyrics |
---|---|---|---|---|
Global Top 50 | 94% | 47 | 1 | 2 |
Argentina Top 50 | 62% | 31 | 9 | 10 |
Australia Top 50 | 96% | 48 | 1 | 1 |
Austria Top 50 | 78% | 39 | 6 | 5 |
Belgium Top 50 | 94% | 47 | 2 | 1 |
Bolivia Top 50 | 80% | 40 | 6 | 4 |
Brazil Top 50 | 24% | 12 | 12 | 26 |
Bulgaria Top 50 | 66% | 33 | 1 | 16 |
Canada Top 50 | 100% | 50 | 0 | 0 |
Chile Top 50 | 80% | 40 | 5 | 5 |
Colombia Top 50 | 78% | 39 | 7 | 4 |
Costa Rica Top 50 | 76% | 38 | 7 | 5 |
Czech Republic Top 50 | 54% | 27 | 7 | 16 |
Denmark Top 50 | 58% | 29 | 1 | 20 |
Dominican Republic Top 50 | 78% | 39 | 5 | 6 |
Ecuador Top 50 | 78% | 39 | 7 | 4 |
El Salvador Top 50 | 78% | 39 | 7 | 4 |
Estonia Top 50 | 58% | 29 | 4 | 17 |
Finland Top 50 | 60% | 30 | 0 | 20 |
France Top 50 | 64% | 32 | 2 | 16 |
Germany Top 50 | 80% | 40 | 7 | 3 |
Greece Top 50 | 38% | 19 | 4 | 27 |
Guatemala Top 50 | 82% | 41 | 6 | 3 |
Honduras Top 50 | 78% | 39 | 7 | 4 |
Hong Kong Top 50 | 80% | 40 | 10 | 0 |
Hungary Top 50 | 80% | 40 | 3 | 7 |
Iceland Top 50 | 60% | 30 | 4 | 16 |
India Top 50 | 52% | 26 | 9 | 15 |
Indonesia Top 50 | 62% | 31 | 4 | 15 |
Ireland Top 50 | 100% | 50 | 0 | 0 |
Israel Top 50 | 62% | 31 | 6 | 13 |
Italy Top 50 | 76% | 38 | 4 | 8 |
Japan Top 50 | 52% | 26 | 19 | 5 |
Latvia Top 50 | 90% | 45 | 1 | 4 |
Lithuania Top 50 | 68% | 34 | 11 | 5 |
Luxembourg Top 50 | 84% | 42 | 4 | 4 |
Malaysia Top 50 | 88% | 44 | 3 | 3 |
Mexico Top 50 | 76% | 38 | 7 | 5 |
Netherlands Top 50 | 72% | 36 | 2 | 12 |
New Zealand Top 50 | 96% | 48 | 0 | 2 |
Nicaragua Top 50 | 80% | 40 | 6 | 4 |
Norway Top 50 | 82% | 41 | 1 | 8 |
Panama Top 50 | 80% | 40 | 6 | 4 |
Paraguay Top 50 | 80% | 40 | 7 | 3 |
Peru Top 50 | 80% | 40 | 5 | 5 |
Philippines Top 50 | 82% | 41 | 4 | 5 |
Poland Top 50 | 30% | 15 | 26 | 9 |
Portugal Top 50 | 66% | 33 | 2 | 15 |
Romania Top 50 | 58% | 29 | 6 | 15 |
Russia Top 50 | 54% | 27 | 16 | 7 |
Singapore Top 50 | 88% | 44 | 6 | 0 |
Slovakia Top 50 | 62% | 31 | 10 | 9 |
South Africa Top 50 | 98% | 49 | 0 | 1 |
Spain Top 50 | 72% | 36 | 4 | 10 |
Sweden Top 50 | 80% | 40 | 7 | 3 |
Switzerland Top 50 | 88% | 44 | 5 | 1 |
Taiwan Top 50 | 68% | 34 | 16 | 0 |
Thailand Top 50 | 82% | 41 | 9 | 0 |
Turkey Top 50 | 50% | 25 | 4 | 21 |
Ukraine Top 50 | 76% | 38 | 7 | 5 |
Contribution
Fork it, submit PR.
- Add translation
- If you can write code, you can fix bugs or improve performance
- Optimize the matching rate of Chinese, Japanese and Korean lyrics.(edit config.json). Note: The extension already has automatic optimization, this list serves as a supplement . Unmatched lyrics report
Privacy Policy
see.