Toolkit.dev
Built on theShoulders of Giants
Toolkit is powered by the incredible work of the open source community.
Next.js
Create T3 App
React
AI SDK
NextAuth.js
Prisma
Redis
Postgres
tRPC
TanStack
Next.js
Create T3 App
React
AI SDK
NextAuth.js
Prisma
Redis
Postgres
tRPC
TanStack
Next.js
Create T3 App
React
AI SDK
NextAuth.js
Prisma
Redis
Postgres
tRPC
TanStack
Next.js
Create T3 App
React
AI SDK
NextAuth.js
Prisma
Redis
Postgres
tRPC
TanStack
Zod
Radix UI
Lucide React
Motion
Shadcn/UI
E2B
Mem0
Recharts
Sonner
Zod
Radix UI
Lucide React
Motion
Shadcn/UI
E2B
Mem0
Recharts
Sonner
Zod
Radix UI
Lucide React
Motion
Shadcn/UI
E2B
Mem0
Recharts
Sonner
Zod
Radix UI
Lucide React
Motion
Shadcn/UI
E2B
Mem0
Recharts
Sonner
Create Custom ToolkitsIn Minutes, Not Hours
Building new AI capabilities is as simple as defining your tools. Configure server tools and client tools, and it automatically works with the entire system.
Define tools and configuration parameters
export const baseToolkit = {
tools: {
myAction: {
description: "Write notes to your workspace",
inputSchema: z.object({
note: z.string(),
}),
outputSchema: z.object({
result: z.string(),
}),
},
},
// user configuration
parameters: z.object({
workspaceId: z.string(),
scopes: z.array(z.string()),
}),
};export const baseToolkit = {
tools: {
myAction: {
description: "Write notes to your workspace",
inputSchema: z.object({
note: z.string(),
}),
outputSchema: z.object({
result: z.string(),
}),
},
},
// user configuration
parameters: z.object({
workspaceId: z.string(),
scopes: z.array(z.string()),
}),
};Define a the look and feel
export const clientToolkit = createClientToolkit(
baseToolkit,
{
name: "Note Taker",
description: "Write notes to your workspace",
icon: Note,
},
{
myAction: {
CallComponent: ({ args }) => (
<p>Writing note to {args.workspaceId}</p>
),
CallButtonComponent: ({ result }) => (
<Button>Save Note</Button>
),
},
},
);export const clientToolkit = createClientToolkit(
baseToolkit,
{
name: "Note Taker",
description: "Write notes to your workspace",
icon: Note,
},
{
myAction: {
CallComponent: ({ args }) => (
<p>Writing note to {args.workspaceId}</p>
),
CallButtonComponent: ({ result }) => (
<Button>Save Note</Button>
),
},
},
);Implement the tool execution
export const serverToolkit = createServerToolkit(
baseToolkit,
"System prompt for toolkit",
async (params) => ({
myAction: {
callback: async (args) => {
// Your custom logic here
const userToken = await getUserToken();
const result = await callExternalAPI(
args.query,
params.apiKey
);
return { result };
},
aiMessage: "Note saved"
},
}),
);export const serverToolkit = createServerToolkit(
baseToolkit,
"System prompt for toolkit",
async (params) => ({
myAction: {
callback: async (args) => {
// Your custom logic here
const userToken = await getUserToken();
const result = await callExternalAPI(
args.query,
params.apiKey
);
return { result };
},
aiMessage: "Note saved"
},
}),
);Configure CustomWorkbenches
Workbenches combine multiple toolkits with specialized system prompts to create focused AI assistants for specific use cases. Each workbench orchestrates toolkit interactions seamlessly.
Research Assistant
Comprehensive research and documentation workbench
System Prompt
“You are a research assistant that helps users gather, analyze, and document information from multiple sources.”
Data Analyst
Data processing and visualization workbench
System Prompt
“You are a data analyst specializing in extracting insights from various data sources and creating compelling visualizations.”
Project Manager
Team coordination and project management workbench
System Prompt
“You are a project manager focused on coordinating teams, scheduling meetings, and tracking project progress.”