Skip to content

kunalkandepatil/musicard

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

73 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

musicard banner

˗ˏˋ musicard ´ˎ˗

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

NPM Version NPM Downloads NPM License GitHub Repo stars


musicard 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

musicard structure

≪ ◦ ✦ ◦ ≫

╰┈3️⃣ Themes

bloom melt haze ease drift calm

≪ ◦ ✦ ◦ ≫

╰┈4️⃣ Customize

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

  1. Customize Background
backgroundColor: "white"
  1. Customize Text
styleConfig: {
    trackStyle: {
        textColor: "black",
        textGlow: true,
        textItalic: true
    }
}
  1. Customize Progress Bar
styleConfig: {
    progressBarStyle: {
        barColor: "#000000",
        barColorDuo: true
    }
}
  1. 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

support server

About

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

Topics

Resources

License

Stars

Watchers

Forks

Sponsor this project

 

Packages

 
 
 

Contributors