DEV Community: Kunal KandePatil

Elevate Your Discord Feeds

Kunal KandePatil — Fri, 26 Jun 2026 15:55:14 +0000

arcade.unbrn.tech

Meet Arcade

If you run a Discord community, you know the struggle: official updates are scattered everywhere except where your members actually hang out. By the time people find the news, it’s probably already stale.

That’s where Arcade comes in.

Arcade is a Discord bot that brings real, AI-enhanced official updates straight to your server. Forget jumping between sites and platforms—you just get what matters, right where everyone is.

How Arcade Works

Arcade keeps your community updated, but it’s not just passing along random notifications. Here’s what sets it apart:

AI-Enhanced Updates — Arcade takes incoming news and cleans it up, so your channels get updates that are clear and easy to read instead of messy chunks of text.
Real-Time Delivery — You get the latest info right when it drops. No more lagging behind.
Optimized Companion Site — We designed our site to work smoothly on both desktop and mobile.
PWA Support for Mobile — If you’re on your phone, you can install Arcade as a Progressive Web App. It runs like a native app right from your browser—no app store hassle.

Why We Built Arcade

We’re developers who kept seeing the same thing: a flood of updates, but everyone still feeling out of the loop. Since Discord is where people already spend their time, we figured it’s smarter to bring the updates to them—and let AI make sense of all the noise.

Try Arcade

Arcade is rolling out now, and you’re invited to be among the first to use it.

Add Arcade to your server
Try out the PWA if you’re on mobile
Tell us what you think—your feedback shapes what comes next

We’re just getting started, with a big roadmap ahead. If you build bots, or have ideas about how AI should handle content delivery, drop a comment. We want to hear from you.

Let’s take Discord updates up a notch. Welcome to Arcade. 🕹️

Voice Agent UI

Kunal KandePatil — Sat, 20 Jun 2026 11:35:42 +0000

Voice Agent

Interactive grid-based voice assistant interface with multiple state visualizers.

Live Simulation >>

[Preview]

[Usage]

import { VoiceAgent } from '@unbrn/ui/VoiceAgent';

export default function Example() {
  return (
    <VoiceAgent
      status="speaking"
      onMuteToggle={() => console.log('Muted')}
      onDisconnect={() => console.log('Hangup')}
    />
  );
}

Examples

Agent Statuses

The voice agent supports 5 statuses: idle, connecting, listening, speaking, and paused.

Speaking Patterns

Choose from three distinct visualization algorithms: blob, wave, and ripple.

Colors

Custom color accents support any valid CSS color property (Hex, RGB, HSL, presets).

This voice agent component is the part of Unbrn/UI considered to be supporting and contributing to our project.

Github >>

🤖 Voice Agent UI

Kunal KandePatil — Sat, 06 Jun 2026 16:14:15 +0000

Voice Agent

Interactive grid-based voice assistant interface with multiple state visualizers.

Live Simulation >>

[Preview]

[Usage]

import { VoiceAgent } from '@unbrn/ui/VoiceAgent';

export default function Example() {
  return (
    <VoiceAgent
      status="speaking"
      onMuteToggle={() => console.log('Muted')}
      onDisconnect={() => console.log('Hangup')}
    />
  );
}

Examples

Agent Statuses

The voice agent supports 5 statuses: idle, connecting, listening, speaking, and paused.

Speaking Patterns

Choose from three distinct visualization algorithms: blob, wave, and ripple.

Colors

Custom color accents support any valid CSS color property (Hex, RGB, HSL, presets).

This voice agent component is the part of Unbrn/UI considered to be supporting and contributing to our project.

Github >>

The visual IDE for AI data structures.

Kunal KandePatil — Sun, 10 May 2026 08:37:17 +0000

🟧 Introducing Struct ⸺ The visual IDE for AI data structures.

Build complex schemas visually, validate them in real-time, and export directly to JSON.

Check it out here: struct.unburn.tech »

No accounts. Just play.

Kunal KandePatil — Mon, 13 Apr 2026 12:00:26 +0000

What is Range?

Range is a minimalist, multiplayer number-guessing game where logic is your only weapon. It’s designed with a retro-arcade aesthetic and a focus on pure, real-time interaction.

The flow is dead simple:

Create a Room: Get a unique code.
Share: Send it to a friend.
Play: Pick a number, and then try to outsmart your opponent by narrowing down their range before they find yours.

The Tech Behind the "No Auth" Experience

As a developer, the challenge wasn't just making it fun; it was making it seamless. To keep it account-free while maintaining real-time multiplayer states, I leaned into a modern, high-performance stack:

Next.js: For the robust framework and speed.
Supabase: Handling the real-time database heavy lifting so guesses and room states sync instantly.
Standard CSS: No heavy utility frameworks here. I used pure CSS to keep the animations fluid and the "retro-minimalist" UI exactly how I envisioned it.

Why I Built This

I’m a big believer in the "small tool" philosophy. Not every side project needs to be a VC-backed SaaS with a complex database schema for user profiles. Sometimes, you just want to build something that people can jump into in 5 seconds, play a round during a coffee break, and close the tab.

Try it out

If you have a minute (literally, that’s all it takes), grab a friend and start a room. No emails, no passwords, no "Confirm your account" prompts.

Link to Game
Link to GitHub Repo

Musicard: Turn Songs into Stunning Visual Cards 🎵

Kunal KandePatil — Sun, 14 Dec 2025 15:35:18 +0000

Musicard 🎵

Generate beautiful, stylized music card images with a variety of modern, customizable themes.

Check our more • Join our Discord

✨ Features

Multiple Themes: Instantly switch between unique card layouts.
Customizable Styles: Change colors, fonts, progress bars, and more for each theme.
Explicit Content Badge: Show/hide explicit content indicator.
Flexible Inputs: Accepts image buffers or URLs for album art.
Font Management: Easily register and use custom fonts.

🎨 Themes

Themes	Preview
Bloom
Haze
Melt
Ease
Drift
Calm

🚀 Quick Start

npm install musicard

import { initializeFonts, Bloom } from 'musicard';
import fs from 'node:fs';

// Display all available font names
import { GlobalFonts } from 'musicard';
console.log(GlobalFonts); // Shows all registered font names

(async () => {
    initializeFonts();

    const musicard = await Bloom({
        trackName: "Run It Up",
        artistName: "Hanumankind",
        albumArt: "https://lh3.googleusercontent.com/6DSrfLUE2JEPhwnF-IFuM5IP8rL8DgrpWPtqh0GvCkdT25Vl5lw3nEjLu-dZ3qIByuoEmU7MS3D8PakF=w544-h544-l90-rj",
        isExplicit: true,
        timeAdjust: {
            timeStart: "0:00",
            timeEnd: "2:54",
        },
        progressBar: 10,
        volumeBar: 70,
    });

    fs.writeFileSync('example.png', musicard);
    console.log('✅-> example.png');
})();

🖨️ List All Available Fonts

To see all font names currently registered and available for use:

import { GlobalFonts } from 'musicard';
console.log(GlobalFonts); // Prints all registered font names

🤖 Usage with Discord Bot

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
    }]
})

🛠️ API Overview

Each theme exports a function with options for customization:

type ThemeOptions = {
    albumArt: string | Buffer;
    fallbackArt: string;
    artistName: string;
    trackName: string;
    progressBar?: number;
    volumeBar?: number; // Ease, Melt
    timeAdjust: { timeStart: string, timeEnd: string };
    styleConfig?: {
        artistStyle?: { textColor?: string; textItalic?: boolean; textGlow?: boolean };
        trackStyle?: { textColor?: string; textItalic?: boolean; textGlow?: boolean };
        timeStyle?: { textColor?: string; textItalic?: boolean };
        progressBarStyle?: { barColor: string; barColorDuo?: boolean };
        volumeBarStyle?: { barColor: string; barColorDuo?: boolean };
    };
    isExplicit?: boolean;
};

🖋️ Fonts

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.

import { registerFont } from 'musicard';
registerFont('MyFont.ttf', 'MyFont');

Modern, minimal portfolio template designed for developers.

Kunal KandePatil — Sat, 24 May 2025 03:24:24 +0000

Hackfolio is a modern, minimal, and fully responsive portfolio template built with Astro. Designed for developers and creators, it helps you showcase your skills, experience, and projects with a clean and professional look.

Features

Minimal & Modern Design: Clean UI with a focus on content and accessibility.
Responsive Layout: Looks great on all devices.
Animated Skill Bars: Show off your skills and frameworks with animated experience bars.
About & Education Sections: Highlight your background and academic journey.
Contact Section: Easy way for visitors to reach out via email or LinkedIn.
Social Links: Quick access to your GitHub, LinkedIn, Twitter, Instagram, and more.
Easy Customization: All content managed via a single content.json file.
Open Source: Fork and make it your own!

Demo

Check out a live demo: kunalkandepatil.me

Preview

Get Started

https://github.com/kunalkandepatil/hackfolio

AI Enhanced Updates | Arcade

Kunal KandePatil — Thu, 20 Jun 2024 16:20:44 +0000

About Arcade

Arcade delivers AI-enhanced updates right on your Discord server, with all types of updates about gaming, entertainment, technology and more.

UI Friendly

We have built a very friendly dashboard that makes it easy to subscribe to games, read updates, patch notes, etc. all in one place.

Favorite Channels

You will find all your favorite gaming, entertainment, or tech channels in one place, or you can request features or channels on our Discord server.

AI Enhanced

Get properly summarized updates using our AI-trained model by Google's Gemini, with the source listed from which we fetch the update.

Invite Arcade to your Discord server.

ImageGround: Netlify Dynamic Image CDN Site

Kunal KandePatil — Fri, 10 May 2024 08:25:43 +0000

This is a submission for the Netlify Dynamic Site Challenge: Visual Feast.

What I Built

I have created a open source web app utilizing Netlify Image CDN and Next.js, offering a powerful and user-friendly experience of transforming image.

Demo

-> https://imageground.netlify.app/
-> https://github.com/flameface/unburn-image-ground

Platform Primitives

Netlify Image CDN is used for transforming images in real time, which then displays the transformed images on our ImageGround panel.

Userfriendly UI for Desktop + Mobile.
Easy to interact.
Image history.
Quick image API URL + Export to any format.
Movable image panel.

And many more...

Clae: Multipurpose Chat Bot

Kunal KandePatil — Thu, 18 Apr 2024 11:53:34 +0000

This is a submission for the Coze AI Bot Challenge: Bot Innovator.

Clae

I made a chat bot for Discord users that can do a lot of things.

It's a friendly chatbot.
Can Generate Images
Play songs.
Fetch weather
Code Error Solving
Help's in your studies.

And many more...

Try

Join our discord server to chat with clae

About

Using Google's latest Gemini model, I made this chatbot. Currently, it is not public, but I will soon make it public so anyone can invite our bot to Discord.

Everyday AI Tools

Kunal KandePatil — Thu, 18 Apr 2024 10:05:36 +0000

Toys 🔥 Open Source AI Tool

Toys, an open-source AI tool designed for everyday purposes utilizes Google's Gemini large language model. While it currently offers a limited number of tools, more useful ones will be added over time.

Live Demo: https://toys.unburn.tech/

Table of Contents
List of Tools
Community
Contributing
Getting Started
Acknowledgements
License

List of Tools

Caption Generator - Generate caption for Instagram and more from image and can generate human-like captions for any image.
Grammar Checker - Check and fix grammar and spelling errors.
Image to Prompt - Generate enhanced prompt from image.
Paraphraser - Rephrase sentence or paragraph in different words without changing meaning.
Summarizer - Summarize paragraphs & sentences in proper simplest format.
Text Extractor - Extract text from image in proper format.

Community

We have a Discord community for developers and creators, a place where you can voice your ideas, explore the products we've made, and have awesome chats.

Contributing

Enhance the awesomeness of Unburn Toys by making your own contributions.

Getting Started

A concise guide to launching the application on your local machine is available in this segment.

Install Dependencies (Requires Node.js v18 or higher.)

npm install

In .env.local.example (Rename to .env.local) Retrieve your API key from Google AI Studio and insert it into GOOGLE_API_KEY. There is no need to modify the MODEL_NAME.

GOOGLE_API_KEY=
MODEL_NAME=gemini-1.5-pro-latest

Run the app (In development)

npm run dev

Acknowledgements

Leveraging Next.js and NextUI accelerates our development process, leading to enhanced production efficiency.

License

The GNU General Public License version 3.0 (GPL-3.0) is a widely used open-source license that grants users the freedom to use, modify, and distribute software under the condition that any derivative works are also licensed under GPL-3.0 and the source code is made accessible to end-users. It ensures that software remains open and accessible, fostering collaboration and innovation within the open-source community.

How simple is it to generate AI images?

Kunal KandePatil — Wed, 10 Apr 2024 14:42:00 +0000

A simple and up to date wrapper for prodia api with all features included.

Github • Support

Installation

npm install prodia.js

Usage

For detailed docs about parameters and api key, go to https://prodia.com

Text to Image

import { Prodia } from "prodia.js"

// ----- OR -----

const { Prodia } = require("prodia.js");
const { generateImage, wait } = Prodia("x-x-x-x-x");

const input = async (prompt) => {
    const result = await generateImage({
        prompt: prompt,
        model: "juggernaut_aftermath.safetensors [5e20c455]"
    })

    return await wait(result);
}

input("a photograph of an astronaut riding a horse in the sky").then(console.log)

Tip: play with parameters like negative_prompt, style_preset, steps etc. to get awesome output.

Know more about generation parameters here

Transform Image

const { Prodia } = require("prodia.js");
const { transform, wait } = Prodia("x-x-x-x-x");

const input = async (prompt) => {
    const result = await transform({
        imageUrl: "https://images.prodia.xyz/4d81be60-6cf2-417e-a800-eab097295f23.png",
        prompt: prompt,
        model: "juggernaut_aftermath.safetensors [5e20c455]"
    })

    return await wait(result);
}

input("").then(console.log)

Know more about transform parameters here

SDXL Generation

const { Prodia } = require("prodia.js");
const { generateImageSDXL, wait } = Prodia("x-x-x-x-x");

const input = async (prompt) => {
    const result = await generateImageSDXL({
        prompt: prompt,
        model: "sd_xl_base_1.0.safetensors [be9edd61]",
        style_preset: "photographic"
    })

    return await wait(result);
}

input("a giant monster hybrid of dragon and spider, in dark dense foggy forest").then(console.log)

Tip: Use getSDXLModels() to get the list or all SDXL models, same for other.

Know more about sdxl parameters here

Face Swap

const { Prodia } = require("prodia.js");
const { faceSwap, wait } = Prodia("x-x-x-x-x");

const input = async ({ sourceUrl, targetUrl }) => {
    const result = await faceSwap({
        sourceUrl,
        targetUrl,
    });

    return await wait(result);
}

input({
    sourceUrl: "https://images.prodia.xyz/fe8bd9b3-c3e6-4c7c-bef2-4038fac54dec.png",
    targetUrl: "https://images.prodia.xyz/2a3ea80c-fd56-49a2-be83-180a3fdc5abe.png"
}).then(console.log)

Tip: Here you may get confused about sourceUrl & targetUrl, targetUrl is main face image and sourceUrl is the face image your want to put on targetUrl.

Know more about faceswap parameters here

Face Restore

const { Prodia } = require("prodia.js");
const { faceRestore, wait } = Prodia("x-x-x-x-x");

const input = async (imageUrl) => {
    const result = await faceRestore({
        imageUrl
    });

    return await wait(result);
}

input("https://images.prodia.xyz/2913f270-3511-4bec-96f3-4ad0b84c1230.png").then(console.log)

Know more about face restore parameters here

There are more features, like Inpainting, ControlNet & Upscale etc.

Support

Our discord community & prodia official server

DEV Community: Kunal KandePatil

Elevate Your Discord Feeds

Meet Arcade

How Arcade Works

Why We Built Arcade

Try Arcade

Voice Agent UI

Voice Agent

Examples

Agent Statuses

Speaking Patterns

Colors

🤖 Voice Agent UI

Voice Agent

Examples

Agent Statuses

Speaking Patterns

Colors

The visual IDE for AI data structures.

No accounts. Just play.

What is Range?

The Tech Behind the "No Auth" Experience

Why I Built This

Try it out

Musicard: Turn Songs into Stunning Visual Cards 🎵

Musicard 🎵

✨ Features

🎨 Themes

🚀 Quick Start

🖨️ List All Available Fonts

🤖 Usage with Discord Bot

🛠️ API Overview

🖋️ Fonts

Modern, minimal portfolio template designed for developers.

Features

Demo

Preview

Get Started

AI Enhanced Updates | Arcade

About Arcade

UI Friendly

Favorite Channels

AI Enhanced

ImageGround: Netlify Dynamic Image CDN Site

What I Built

Demo

Platform Primitives

Clae: Multipurpose Chat Bot

Clae

Try

About

Everyday AI Tools

Toys 🔥 Open Source AI Tool

Table of Contents

List of Tools

Community

Contributing

Getting Started

Acknowledgements

License

How simple is it to generate AI images?

Installation

Usage

Text to Image

Transform Image

SDXL Generation

Face Swap

Face Restore

Support