˗ˏˋ musicard ´ˎ˗

A powerful canvas-based library to generate stunning, highly customizable music cards with modern themes and rich features.

📄 Documentation

╰┈1️⃣ Usage

npm install musicard

import { initializeFonts, Bloom } from 'musicard';
import fs from 'node:fs';

(async () => {
    initializeFonts();

    const musicard = await Bloom({
        trackName: "Blinding Lights",
        artistName: "The Weeknd",
        albumArt: "", // Image Path/URL
        isExplicit: true,
        timeAdjust: {
            timeStart: "0:00",
            timeEnd: "2:54",
        },
        progressBar: 10,
        volumeBar: 70,
    });

    fs.writeFileSync('example.png', musicard);
    console.log('✅-> example.png');
})();

Here's how you can use musicard in a Discord bot to generate and send a music card image:

const { initializeFonts, Bloom } = require("musicard");
const fs = require("fs")

await initializeFonts();
const musicard = await Bloom({...})

...

return message.channel.send({
    files: [{
        attachment: musicard
    }]
})

╰┈2️⃣ Structure

╰┈3️⃣ Themes

╰┈4️⃣ Customize

You now have the ability to completely personalize your music card, such as:

1. Customize Background

backgroundColor: "white"

2. Customize Text

styleConfig: {
    trackStyle: {
        textColor: "black",
        textGlow: true,
        textItalic: true
    }
}

3. Customize Progress Bar

styleConfig: {
    progressBarStyle: {
        barColor: "#000000",
        barColorDuo: true
    }
}

4. Custom Font support

import { registerFont } from 'musicard';
registerFont('MyFont.ttf', 'MyFont');

⚠️ Note: To use custom fonts, create a Fonts folder in your project's root directory and place your font files (e.g., .ttf, .otf) inside it.

╰┈5️⃣ Examples

1. To see all font names currently registered and available for use:

import { GlobalFonts } from 'musicard';
console.log(GlobalFonts); // Prints all registered font names

🎧 Support Server