Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/unburn/musicard

Musicard is a futuristic music card canvas library
https://github.com/unburn/musicard

canvas discord-canvas lavalink music music-bot-discord music-card music-card-discord node-canvas spotify unburn youtube

Last synced: 12 days ago
JSON representation

Musicard is a futuristic music card canvas library

Host: GitHub
URL: https://github.com/unburn/musicard
Owner: unburn
License: gpl-3.0
Created: 2023-07-30T11:38:05.000Z (over 1 year ago)
Default Branch: main
Last Pushed: 2024-08-01T12:19:28.000Z (3 months ago)
Last Synced: 2024-10-29T04:07:44.035Z (15 days ago)
Topics: canvas, discord-canvas, lavalink, music, music-bot-discord, music-card, music-card-discord, node-canvas, spotify, unburn, youtube
Language: TypeScript
Homepage:
Size: 20 MB
Stars: 82
Watchers: 1
Forks: 22
Open Issues: 2
Metadata Files:
- Readme: readme.md
- License: LICENSE
- Codeowners: .github/CODEOWNERS

Awesome Lists containing this project

README

        

Musicard is one of the best canvas libraries to create a variety of music cards.




    Github •

    Support





[![NPM Version](https://img.shields.io/npm/v/musicard?style=flat-square&color=%23FF7A00)](https://www.npmjs.com/package/musicard)

[![NPM Downloads](https://img.shields.io/npm/dw/musicard?style=flat-square&color=%23FF7A00)](https://www.npmjs.com/package/musicard)

[![NPM License](https://img.shields.io/npm/l/musicard?style=flat-square&color=%23FF7A00)](https://github.com/unburn/musicard/blob/main/LICENSE)

[![GitHub Repo stars](https://img.shields.io/github/stars/unburn/musicard?style=flat-square&color=%23FF7A00)](https://github.com/unburn/musicard)









# Installation

```js

// using npm

npm install musicard

// using yarn

yarn add musicard

```

# Usage

You can use the Musicard package in your Discord bots, websites, etc.

## Using Create File

```js

import { Classic } from 'musicard';

import fs from 'fs';

//OR

const { Classic } = require('musicard');

const fs = require('fs');

Classic({}).then(x => {

    fs.writeFileSync('output.png', x);

});

```

## Using Discord Bot

```js

const { Classic } = require("musicard");

const fs = require("fs")

const musicard = await Classic({});

...

return message.channel.send({

    files: [{

        attachment: musicard

    }]

})

```

## Custom Background (New)

Use a custom image background and also adjust the darkness of the image.

```js

import { Classic } from 'musicard';

import fs from 'fs';

Classic({

    thumbnailImage:

        'https://cdn.discordapp.com/attachments/1220001571228880917/1220001571690123284/01.png?ex=660d5a01&is=65fae501&hm=a8cfb44844e61aa0fd01767cd363af048df28966c30d7b04a59f27fa45cf69c4&',

    backgroundImage:

        'https://cdn.discordapp.com/attachments/1220001571228880917/1220001571690123284/01.png?ex=660d5a01&is=65fae501&hm=a8cfb44844e61aa0fd01767cd363af048df28966c30d7b04a59f27fa45cf69c4&',

    imageDarkness: 60,

    nameColor: '#DC92FF',

    progressColor: '#DC92FF',

    progressBarColor: '#2B2B2B',

    progress: 50,

}).then(x => {

    fs.writeFileSync('output.png', x);

});

```

![custom](https://ik.imagekit.io/unburn/custom-output.png?updatedAt=1710995171966)

# Themes

Musicard is the #1 canvas library to create music cards with awesome themes.

## Classic

![classic](https://ik.imagekit.io/unburn/Classic.svg)

```js

(async () => {

    const { Classic } = require('musicard');

    const fs = require('fs');

    const musicard = await Classic({

        thumbnailImage:

            'https://lh3.googleusercontent.com/yavtBZZnoxaY21GSS_VIKSg0mvzu1b0r6arH8xvWVskoMaZ5ww3iDMgBNujnIWCt7MOkDsrKapSGCfc=w544-h544-l90-rj',

        backgroundColor: '#070707',

        progress: 10,

        progressColor: '#FF7A00',

        progressBarColor: '#5F2D00',

        name: 'Burn',

        nameColor: '#FF7A00',

        author: 'By 2WEI & Edda Hayes',

        authorColor: '#696969',

        startTime: '0:00',

        endTime: '4:00',

        timeColor: '#FF7A00',

    });

    fs.writeFileSync('musicard.png', musicard);

})();

```

---

## Classic Pro

![classicpro](https://ik.imagekit.io/unburn/ClassicPro.svg)

```js

(async () => {

    const { ClassicPro } = require('musicard');

    const fs = require('fs');

    const musicard = await ClassicPro({

        thumbnailImage:

            'https://lh3.googleusercontent.com/yavtBZZnoxaY21GSS_VIKSg0mvzu1b0r6arH8xvWVskoMaZ5ww3iDMgBNujnIWCt7MOkDsrKapSGCfc=w544-h544-l90-rj',

        backgroundColor: '#070707',

        progress: 10,

        progressColor: '#FF7A00',

        progressBarColor: '#5F2D00',

        name: 'Burn',

        nameColor: '#FF7A00',

        author: 'By 2WEI & Edda Hayes',

        authorColor: '#696969',

        startTime: '0:00',

        endTime: '4:00',

        timeColor: '#FF7A00',

    });

    fs.writeFileSync('musicard.png', musicard);

})();

```

---

## Dynamic

![dynamic](https://ik.imagekit.io/unburn/Dynamic.svg)

```js

(async () => {

    const { Dynamic } = require('musicard');

    const fs = require('fs');

    const musicard = await Dynamic({

        thumbnailImage:

            'https://lh3.googleusercontent.com/yavtBZZnoxaY21GSS_VIKSg0mvzu1b0r6arH8xvWVskoMaZ5ww3iDMgBNujnIWCt7MOkDsrKapSGCfc=w544-h544-l90-rj',

        backgroundColor: '#070707',

        progress: 10,

        progressColor: '#FF7A00',

        progressBarColor: '#5F2D00',

        name: 'Burn',

        nameColor: '#FF7A00',

        author: 'By 2WEI & Edda Hayes',

        authorColor: '#696969',

    });

    fs.writeFileSync('musicard.png', musicard);

})();

```

---

## Mini

![mini](https://ik.imagekit.io/unburn/Mini.svg)

```js

(async () => {

    const { Mini } = require('musicard');

    const fs = require('fs');

    const musicard = await Mini({

        thumbnailImage:

            'https://lh3.googleusercontent.com/yavtBZZnoxaY21GSS_VIKSg0mvzu1b0r6arH8xvWVskoMaZ5ww3iDMgBNujnIWCt7MOkDsrKapSGCfc=w544-h544-l90-rj',

        backgroundColor: '#070707',

        progress: 10,

        progressColor: '#FF7A00',

        progressBarColor: '#5F2D00',

        menuColor: '#FF7A00',

        paused: false,

    });

    fs.writeFileSync('musicard.png', musicard);

})();

```

---

## Upcoming

![Upcoming](https://ik.imagekit.io/unburn/Upcoming.svg)

```js

(async () => {

    const { Upcoming } = require('musicard');

    const fs = require('fs');

    const musicard = await Upcoming({

        thumbnailImage: 'https://img.youtube.com/vi/lmG0kY9FtRY/maxresdefault.jpg',

        backgroundImage: fs.readFileSync('bg.png'),

        imageDarkness: 70,

        author: 'Testing by UG',

        title: 'Bad Boy (feat. Luana Kiara)',

        trackIndexBackgroundRadii: [10, 20, 30, 40, 50, 60, 70, 80, 80, 100],

    });

    fs.writeFileSync('musicard.png', musicard);

})();

```

# Resource

Pull request to add your project here.

| Riffy Music Bot | https://github.com/riffy-team/riffy-music-bot |

| --------------- | --------------------------------------------- |

# Licence

[GPL](https://github.com/unburn/musicard/blob/main/LICENSE)