ZarcoGreeter makes creating greeting card images in Node.js effortless and fully customizable.
- Multiple Styles: Choose from several pre-designed card styles.
- Customizable: Easily change colors, text, and background images.
- High Performance: Built with
@napi-rs/canvas
for optimal speed. - Easy to Use: Simple, intuitive API for generating cards programmatically.
- ESM & CJS Support: Use with both
import
andrequire
.
Style 1 | Style 2 |
---|---|
![]() |
![]() |
Style 3 | Style 4 |
![]() |
![]() |
Fully Customized |
---|
![]() |
npm install zarcogreeter
Below are some examples of how to use ZarcoGreeter. You can use either ES Modules (ESM) or CommonJS (CJS).
ESM
import { style1 } from 'zarcogreeter';
import fs from 'fs';
async function generateCard() {
const user = {
username: 'ZarCodeX',
avatarURL: 'https://raw.githubusercontent.com/ZarCodeX/ZarcoGreeter/refs/heads/main/assets/images/ZarCodeX%20(original).png',
};
const guild = 'My Awesome Server';
const buffer = await style1(user, guild);
fs.writeFileSync('welcome-style1-basic.png', buffer);
}
generateCard();
CJS
const { style1 } = require('zarcogreeter');
const fs = require('fs');
async function generateCard() {
const user = {
username: 'ZarCodeX',
avatarURL: 'https://raw.githubusercontent.com/ZarCodeX/ZarCodeX/refs/heads/main/assets/images/ZarCodeX%20(original).png',
};
const guild = 'My Awesome Server';
const buffer = await style1(user, guild);
fs.writeFileSync('welcome-style1-basic.png', buffer);
}
generateCard();
Result:
ESM
import { style1 } from 'zarcogreeter';
import fs from 'fs';
async function generateCard() {
const user = {
username: 'ZarCodeX',
avatarURL: 'https://raw.githubusercontent.com/ZarCodeX/ZarcoGreeter/refs/heads/main/assets/images/ZarCodeX%20(original).png',
};
const guild = 'My Awesome Server';
const buffer = await style1(user, guild, {
backgroundImage: 'https://raw.githubusercontent.com/ZarCodeX/ZarcoGreeter/refs/heads/main/assets/images/bg.png',
});
fs.writeFileSync('welcome-style1-custom-bg.png', buffer);
}
generateCard();
CJS
const { style1 } = require('zarcogreeter');
const fs = require('fs');
async function generateCard() {
const user = {
username: 'ZarCodeX',
avatarURL: 'https://raw.githubusercontent.com/ZarCodeX/ZarCodeX/refs/heads/main/assets/images/ZarCodeX%20(original).png',
};
const guild = 'My Awesome Server';
const buffer = await style1(user, guild, {
backgroundImage: 'https://raw.githubusercontent.com/ZarCodeX/ZarcoGreeter/refs/heads/main/assets/images/bg.png',
});
fs.writeFileSync('welcome-style1-custom-bg.png', buffer);
}
generateCard();
Result:
ESM
import { style2 } from 'zarcogreeter';
import fs from 'fs';
async function generateCard() {
const user = {
username: 'ZarCodeX',
avatarURL: 'https://raw.githubusercontent.com/ZarCodeX/ZarcoGreeter/refs/heads/main/images/ZarCodeX%20(original).png',
};
const guild = 'My Awesome Server';
const buffer = await style2(user, guild, {
backgroundImage: 'https://raw.githubusercontent.com/ZarCodeX/ZarcoGreeter/refs/heads/main/assets/images/bg.png',
});
fs.writeFileSync('welcome-style2-custom-bg.png', buffer);
}
generateCard();
CJS
const { style2 } = require('zarcogreeter');
const fs = require('fs');
async function generateCard() {
const user = {
username: 'ZarCodeX',
avatarURL: 'https://raw.githubusercontent.com/ZarCodeX/ZarCodeX/refs/heads/main/images/ZarCodeX%20(original).png',
};
const guild = 'My Awesome Server';
const buffer = await style2(user, guild, {
backgroundImage: 'https://raw.githubusercontent.com/ZarCodeX/ZarcoGreeter/refs/heads/main/assets/images/bg.png',
});
fs.writeFileSync('welcome-style2-custom-bg.png', buffer);
}
generateCard();
Result:
ESM
import { style3 } from 'zarcogreeter';
import fs from 'fs';
async function generateCard() {
const user = {
username: 'ZarCodeX',
avatarURL: 'https://raw.githubusercontent.com/ZarCodeX/ZarcoGreeter/refs/heads/main/images/ZarCodeX%20(original).png',
};
const guild = 'My Awesome Server';
const buffer = await style3(user, guild, {
backgroundImage: 'https://raw.githubusercontent.com/ZarCodeX/ZarcoGreeter/refs/heads/main/assets/images/bg.png',
});
fs.writeFileSync('welcome-style3-custom-bg.png', buffer);
}
generateCard();
CJS
const { style3 } = require('zarcogreeter');
const fs = require('fs');
async function generateCard() {
const user = {
username: 'ZarCodeX',
avatarURL: 'https://raw.githubusercontent.com/ZarCodeX/ZarcoGreeter/refs/heads/main/images/ZarCodeX%20(original).png',
};
const guild = 'My Awesome Server';
const buffer = await style3(user, guild, {
backgroundImage: 'https://raw.githubusercontent.com/ZarCodeX/ZarcoGreeter/refs/heads/main/assets/images/bg.png',
});
fs.writeFileSync('welcome-style3-custom-bg.png', buffer);
}
generateCard();
Result:
ESM
import { style4 } from 'zarcogreeter';
import fs from 'fs';
async function generateCard() {
const user = {
username: 'ZarCodeX',
avatarURL: 'https://raw.githubusercontent.com/ZarCodeX/ZarCodeX/refs/heads/main/images/ZarCodeX%20(original).png',
};
const guild = 'My Awesome Server';
const buffer = await style4(user, guild, {
backgroundImage: 'https://raw.githubusercontent.com/ZarCodeX/ZarcoGreeter/refs/heads/main/assets/images/bg.png',
});
fs.writeFileSync('welcome-style4-custom-bg.png', buffer);
}
generateCard();
CJS
const { style4 } = require('zarcogreeter');
const fs = require('fs');
async function generateCard() {
const user = {
username: 'ZarCodeX',
avatarURL: 'https://raw.githubusercontent.com/ZarCodeX/ZarCodeX/refs/heads/main/images/ZarCodeX%20(original).png',
};
const guild = 'My Awesome Server';
const buffer = await style4(user, guild, {
backgroundImage: 'https://raw.githubusercontent.com/ZarCodeX/ZarcoGreeter/refs/heads/main/assets/images/bg.png',
});
fs.writeFileSync('welcome-style4-custom-bg.png', buffer);
}
generateCard();
Result:
ESM
import { style2 } from 'zarcogreeter';
import fs from 'fs';
async function generateCard() {
const user = {
username: 'ZarCodeX',
avatarURL: 'https://raw.githubusercontent.com/ZarCodeX/ZarcoGreeter/refs/heads/main/images/ZarCodeX%20(original).png',
};
const guild = 'My Awesome Server';
const buffer = await style2(user, guild, {
text: 'Greetings',
});
fs.writeFileSync('welcome-style2-custom-text.png', buffer);
}
generateCard();
CJS
const { style2 } = require('zarcogreeter');
const fs = require('fs');
async function generateCard() {
const user = {
username: 'ZarCodeX',
avatarURL: 'https://raw.githubusercontent.com/ZarCodeX/ZarCodeX/refs/heads/main/images/ZarCodeX%20(original).png',
};
const guild = 'My Awesome Server';
const buffer = await style2(user, guild, {
text: 'Greetings',
});
fs.writeFileSync('welcome-style2-custom-text.png', buffer);
}
generateCard();
Result:
ESM
import { style3 } from 'zarcogreeter';
import fs from 'fs';
async function generateCard() {
const user = {
username: 'ZarCodeX',
avatarURL: 'https://raw.githubusercontent.com/ZarCodeX/ZarCodeX/refs/heads/main/images/ZarCodeX%20(original).png',
};
const guild = 'My Awesome Server';
const buffer = await style3(user, guild, {
backgroundImage: 'https://raw.githubusercontent.com/ZarCodeX/ZarcoGreeter/refs/heads/main/assets/images/bg.png',
welcomeColor: '#69ffffff',
usernameColor: '#FFFFFF',
guildColor: '#ade4e6ff',
});
fs.writeFileSync('welcome-style3-fully-custom.png', buffer);
}
generateCard();
CJS
const { style3 } = require('zarcogreeter');
const fs = require('fs');
async function generateCard() {
const user = {
username: 'ZarCodeX',
avatarURL: 'https://raw.githubusercontent.com/ZarCodeX/ZarCodeX/refs/heads/main/images/ZarCodeX%20(original).png',
};
const guild = 'My Awesome Server';
const buffer = await style3(user, guild, {
backgroundImage: 'https://raw.githubusercontent.com/ZarCodeX/ZarcoGreeter/refs/heads/main/assets/images/bg.png',
welcomeColor: '#69ffffff',
usernameColor: '#FFFFFF',
guildColor: '#ade4e6ff',
});
fs.writeFileSync('welcome-style3-fully-custom.png', buffer);
}
generateCard();
Result:
The following style functions are available:
style1(user, guild, options)
style2(user, guild, options)
style3(user, guild, options)
style4(user, guild, options)
All functions return a Promise
that resolves to a Buffer
containing the PNG image data.
The user
object must contain the following properties:
username
(string): The user's username.avatarURL
(string): A URL to the user's avatar image.
The guild
string is the name of the server or community.
The options
object is optional and can contain the following properties:
Option | Type | Description | Default |
---|---|---|---|
backgroundImage |
string | Path or URL to a custom background image. | Varies by style |
welcomeColor |
string | Hex color code for the welcome text. | #FFFFFF |
usernameColor |
string | Hex color code for the username text. | #FFFFFF |
guildColor |
string | Hex color code for the guild text. | Varies by style |
avatarBorderColor |
string | Hex color code for the avatar border. | #00A8FF (style1 only) |
text |
string | Custom welcome text. | "WELCOME" or "Welcome" |
Each style has a different character limit for the custom text:
- style1: 15 characters
- style2: 15 characters
- style3: 20 characters
Contributions, issues, and feature requests are welcome! Feel free to check the issues page.
This project is MIT licensed.
- Author: ZarCodeX
- Website: https://zarcodex.github.io
- Discord: https://discord.gg/6YVmxA4Qsf
- X (Twitter): https://x.com/ZarCodeX
- GitHub Repo: https://github.com/ZarCodeX/ZarcoGreeter