JSPM

  • ESM via JSPM
  • ES Module Entrypoint
  • Export Map
  • Keywords
  • License
  • Repository URL
  • TypeScript Types
  • README
  • Created
  • Published
  • Downloads 263
  • Score
    100M100P100Q91856F
  • License MIT

Generate stylish welcome cards with Node.js and canvas

Package Exports

  • catozolala-card-canvas

Readme

🎉 catozolala-card-canvas

-----------------------------------------------------

A modern Discord-like card generator — perfect for WhatsApp bots, Telegram bots, and other community projects!

NPM Package WhatsApp Channel

🎨 catozolala-card-canvas

Modul Node.js untuk membuat kartu sambutan (welcome card) dengan desain modern menggunakan canvas.

📖 Read More

catozolala-card-canvas is a Node.js library that automatically generates clean and modern image cards, inspired by Discord's welcome and goodbye card styles.

✨ Features

  • Discord-style modern look
  • Customizable background & avatar
  • Display username, tag, and date
  • Supports both welcome and leaving cards
  • Output: PNG buffer ready to send to chat

🛠 Created by: catozolala
☁️ Baileys user: wave cloudx


💬 Code


📥 drawWelcomeCard()

COMMONJS

const { drawWelcomeCard } = require('catozolala-card-canvas');
const fs = require('fs');

// Created by catozolala
// Baileys user: wave cloudx

(async () => {
  const buffer = await drawWelcomeCard({
    username: 'Catozolala',
    tag: '#0608',
    avatarURL: 'https://cdn.pixabay.com/photo/2015/10/05/22/37/blank-profile-picture-973460_960_720.png?q=60',
    backgroundURL: 'https://i.ibb.co/Ccg2ctT/background.png',
    date: 'Jun 6, 2025',
    isOnline: true // true green > false red
  });

  fs.writeFileSync('welcome.png', buffer);
})();

ESM

import { drawWelcomeCard } from 'catozolala-card-canvas';
import { writeFileSync } from 'fs';

const buffer = await drawWelcomeCard({
  username: 'Nekotina',
  tag: '#0608',
  avatarURL: 'https://example.com/avatar.jpg',
  backgroundURL: 'https://example.com/background.jpg',
  date: 'Jun 07, 2025',
  isOnline: true // true green > false red
});

📥 generateCardGlowInTheDark()

COMMONJS

const { generateCardGlowInTheDark } = require('catozolala-card-canvas');

(async () => {
  const buffer = await generateCardGlowInTheDark({
    avatarPath: "https://cdn.pixabay.com/photo/2015/10/05/22/37/blank-profile-picture-973460_960_720.png",
    teks: 'WELCOME',
    name: 'Spee',
    totalMember: 7123,
    backgroundPath: "https://i.ibb.co/b5ct2NSN/photo-1414831-jpg-d.jpg"
  });
})();

ESM

import { generateCardGlowInTheDark } from 'catozolala-card-canvas';

(async () => {
  const buffer = await generateCardGlowInTheDark({
    avatarPath: 'https://cdn.pixabay.com/photo/2015/10/05/22/37/blank-profile-picture-973460_960_720.png',
    teks: 'WELCOME',
    name: 'Spee',
    totalMember: 7123,
    backgroundPath: 'https://i.ibb.co/b5ct2NSN/photo-1414831-jpg-d.jpg'
  });

  // Simpan hasil jika perlu
  import { writeFile } from 'fs/promises';
  await writeFile('output.png', buffer);
})();

📦 Installation

npm install catozolala-card-canvas