https://github.com/iasure/discord-arts
Customized cards with Discord style
https://github.com/iasure/discord-arts
canvas discord nodejs
Last synced: 12 months ago
JSON representation
Customized cards with Discord style
- Host: GitHub
- URL: https://github.com/iasure/discord-arts
- Owner: iAsure
- License: other
- Created: 2023-01-01T00:49:22.000Z (over 3 years ago)
- Default Branch: master
- Last Pushed: 2024-10-16T21:08:45.000Z (over 1 year ago)
- Last Synced: 2025-06-25T14:47:27.879Z (about 1 year ago)
- Topics: canvas, discord, nodejs
- Language: JavaScript
- Homepage:
- Size: 679 KB
- Stars: 89
- Watchers: 3
- Forks: 16
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE.ms
Awesome Lists containing this project
README
## 📦 Installation
```bash
npm i discord-arts@latest
```
## ✨ Features
- 🚀 Fast generation!
- 🎨 Simple and beautiful design
- 🎖️ Easy to use
- 💎 Beginner friendly
- ❌ Discord.js not required
## 📌 What's New
- 🖼️ Avatar decorations/frames
- 🎴 Automatic profile theme colors
- 🔮 Booster badges are back
- 🛡️ Automod and LegacyUsername badges
## 🖼️ Cards
### 🪄 profileImage(userId, imgOptions?)
Generate a profile image card for a user or bot, including badges and custom options.
**Returns:** Promise
#### imgOptions
| Option | Type | Description |
|--------|------|-------------|
| customUsername | string | Customize the username |
| customTag | string | Text below the user |
| customSubtitle | string | Text below the custom tag |
| customBadges | string[] | Your own png badges (path and URL) (46x46) |
| customBackground | string | Change the background to any image (path and URL) (885x303) |
| overwriteBadges | boolean | Merge your badges with the discord defaults |
| badgesFrame | boolean | Creates a small frame behind the badges |
| removeBadges | boolean | Removes badges, whether custom or from discord |
| removeBorder | boolean | Removes the image border, custom and normal |
| usernameColor | string | Username HEX color |
| tagColor | string | Tag HEX color |
| borderColor | string \| string[] | Border HEX color, can be gradient if 2 colors are used |
| borderAllign | string | Gradient alignment if 2 colors are used |
| disableProfileTheme | boolean | Disable the discord profile theme colors |
| presenceStatus | string | User status to be displayed below the avatar |
| squareAvatar | boolean | Change avatar shape to a square |
| removeAvatarFrame | boolean | Remove the discord avatar frame/decoration (if any) |
| rankData | object | Rank data options (see below) |
| moreBackgroundBlur | boolean | Triples blur of background image |
| backgroundBrightness | number | Set brightness of background from 1-100% |
| customDate | Date \| string | Custom date or text to use instead of when user joined Discord |
| localDateType | string | Local format for the date, e.g. 'en' \| 'es' etc. |
#### rankData Options
| Option | Type | Description |
|--------|------|-------------|
| currentXp | number | Current user XP |
| requiredXp | number | XP required to level up |
| level | number | Current user level |
| rank | number | Position on the leaderboard |
| barColor | string | HEX XP bar color |
| levelColor | string | HEX color of LVL text |
| autoColorRank | boolean | Whether to color ranks as medal colors for 1st, 2nd, 3rd |
## 📃 Code Example (Discord.js v14)
```javascript
const { AttachmentBuilder } = require('discord.js');
const { profileImage } = require('discord-arts');
await interaction.deferReply();
const user = interaction.options.getUser('user-option');
const buffer = await profileImage(user.id, {
customTag: 'Admin',
squareAvatar: true,
// ... other imgOptions
});
interaction.followUp({ files: [buffer] });
```
## Example Results
### Rank Card
```javascript
profileImage('UserID', {
customBadges: ['./skull.png', './rocket.png', './crown.png'],
presenceStatus: 'phone',
badgesFrame: true,
customDate: 'AWESOME!',
moreBackgroundBlur: true,
backgroundBrightness: 100,
rankData: {
currentXp: 2100,
requiredXp: 3000,
rank: 1,
level: 20,
barColor: '#fcdce1',
levelColor: '#ada8c6',
autoColorRank: true
}
});
```
### Custom User Card
```javascript
profileImage('UserID', {
borderColor: ['#0000ff', '#00fe5a'],
presenceStatus: 'idle',
removeAvatarFrame: false
});
```
### Custom Bot Card
```javascript
profileImage('UserID', {
customBackground: 'https://i.imgur.com/LWcWzlc.png',
borderColor: '#ec8686',
presenceStatus: 'online',
badgesFrame: true
});
```
## ⭐ Support
Join our [Discord Server](https://discord.gg/csedxqGQKP) for support and community discussions.