A Node.js/TypeScript remake of the original BeatPrints by TrueMyst.
Design Pinterest-style music posters powered by Spotify and LRClib in your app. π
BeatPrints.js is a visual utility to generate music posters from your favorite tracks and albums. This Node.js version brings the spirit of the original Python BeatPrints project to the JavaScript ecosystem, supporting:
- π¨ Rich visual themes (Catppuccin, Nord, RosePine, etc.)
- πΌοΈ Album/track art with Spotify scannables
- βοΈ Lyric highlights from LRClib
- π Output as file or in-memory buffer
pnpm add beatprints.js
# or
npm install beatprints.jsMake sure you have a .env file with your Spotify credentials:
SPOTIFY_CLIENT_ID="your-client-id"
SPOTIFY_CLIENT_SECRET="your-client-secret"You can get these from: Spotify Developer Dashboard
import { Spotify, Lyrics, Poster } from 'beatprints.js';
const client = new Spotify(
process.env.SPOTIFY_CLIENT_ID,
process.env.SPOTIFY_CLIENT_SECRET
);
const lrc = new Lyrics();
const poster = new Poster({
filename: 'love_lost.png',
output: {
type: 'path',
value: './path/to/output/dir'
}
});
const search = await client.getTrack('love lost - boywithuke', 1);
const lyrics = await lrc.getLyrics(search, true);
const highLightedLyrics = await lrc.selectLines(lyrics, '31-34');
await poster.track(search, highLightedLyrics, { palette: true, accent: true });The example above will result in this:
- π Album and π§ Track poster generation
- ποΈ Theme support: Light, Dark, Catppuccin, Nord, Gruvbox, RosePine, Everforest
- π§ Smart text layout & column handling
- πΌ Lyric support via LRClib
- π Accent colors from cover palette
- π¦ Buffer or file output
- π Custom fonts
// Save poster to file
new Poster({ type: 'path', value: './output', filename: 'example.png' /* optional */ });
// Return poster as Buffer (useful for APIs)
new Poster({ type: 'buffer' });// Available themes: "Light", "Dark", "Catppuccin", "Gruvbox", "Nord", "RosePine", "Everforest"
await poster.track(metadata, selectedLyrics, {
theme: 'Catppuccin'
});If you want to add support for custom fonts not included by default (e.g., NotoSansSC for Simplified Chinese), you can register them dynamically like this:
import { registerCustomFonts } from 'beatprints.js';
// Paths to your font files. Each file should be named in the format Family-Weight.ttf
const fontPaths = [
'/path/to/fonts/NotoSansSC/NotoSansSC-Regular.ttf',
'/path/to/fonts/NotoSansSC/NotoSansSC-Bold.ttf',
'/path/to/fonts/NotoSansSC/NotoSansSC-Light.ttf',
];
// Provide an alias mapping folder/family name to display name used internally
const aliases = {
'NotoSansSC': 'Noto Sans SC',
};
// Register your custom fonts
registerCustomFonts(fontPaths, aliases);
// Now you can use "Noto Sans SC" as a font alias in rendering functionsImportant
- "Make sure your font files follow the naming convention
Family-Weight.ttfexactly."- "Register all weights you intend to use (e.g. Regular, Light, Bold)."
This allows you to seamlessly extend font support without modifying internal code or defaults.
BeatPrints.js is a derivative of the original BeatPrints by TrueMyst. Distributed under the Creative Commons Attribution-NonCommercial-ShareAlike 4.0 International (CC BY-NC-SA 4.0) License.
You may:
- β Share and adapt the material
- β Not use it for commercial purposes
- π Share alike with proper attribution
More: LICENSE
- Original concept & inspiration: TrueMyst
- Fonts, layout, ideas based on the Python version
- Color palette extraction: sharp-vibrant
- Lyrics: LRClib
Made with π and too many playlists β BeatPrints.js 2025





