Quartal Plugins are packaged business functionality for AI agents: Chatbots, Autonomous agents as well as Vibe coding tools. However, the packaging is done in a way that also more traditional software such as SaaS software and internal Corporate systems and automation can use the same plugins / packages. The functionalities are packaged as Tools (services), Widgets (UI), Agent Skills, Agents and Prompts.

The basic idea is that you can create a Quartal Plugins package once containing all the business logic for a specific business domain. You can then publish that package as a simple web site and other people inside or outside your organization can use that logic in different chatbots, agents, vibe tools, integrations and other software using Model Context Protocol (MCP), Open API (REST), Claude plugins, Agent skills and more...

[!NOTE] Under construction We are currently pushing Quartal Plugins to TEST as of 08/2026 and v01 PROD in 09/2026. This description is written for the PROD target stage in 09/2026: Some features described below may not be present in the current published version and we do not guarantee that all of these features make the final cut.

Getting Started

Requirements

• Node.js 20+
• We recommend MCPJam for local testing, especially for widgets.

Create a plugin

pnpm create @quartal/plugin

Alternatively, fork the template repository at quartal-hub/plugin-template.

Run it

pnpm install
pnpm dev

Your plugin is an Astro project running on http://localhost:4321, serving:

| URL | What | | ----------------------- | ------------------------------------------------------------------------ | | / | Documentation site for your plugin (tools, widgets, skills, API testers) | | /mcp | The MCP server — connect any MCP client here | | /api/<Class>/<method> | The generated OpenAPI / REST actions | | /plugin.json | The plugin manifest | | /widgets/<toolId> | Your widget pages | | /skills/catalog.json | The Agent Skills catalog |

Make it yours

1. Add a tool: create a class in src/tools/ and export it from src/tools/mod.ts —    see Creating tools.
2. Add a widget for a tool: create a page in src/pages/widgets/ —    see MCP Apps widgets.
3. Add a skill: create a folder with a SKILL.md under skills/ —    see Agent Skills. See more in https://plugin.quartal.com/docs/

Test with an MCP client

Point MCPJam (or Claude, or any MCP client) at http://localhost:4321/mcp and try your tools live.

Deploy

Build and run like any server-output Astro site — then deploy to any modern hosting platform:

pnpm build
node ./dist/server/entry.mjs

MCP Apps Widgets: Add UI to your tools

You can easily add custom user interface to interact with any of your tools. This has the following benefits:

• The Tool results and further interaction UI will be rendered exactly as you specify, not something that the model vibes on-the-fly (no hallucinations).
• User saves a lot of tokens: tokens are not used for UI rendering
• Widget UI renders many times faster than when streamed from the model on-the-fly

MCP Apps standard is supported by the state-of-the-art chatbots, namely Anthropic Claude, OpenAI ChatGPT and M365 Copilot as well as Quartal Hub and Quartal Messages / Quartal Harness embeddable user interfaces. Other chat clients not supporting Widgets fall back to rendering UI by the AI model.

Quartal Plugins is based an Astro so you can use basically any of your favourite UI framework such as React, Vue, Svelte, Plain JavaScript, and more. See our Plugin template repository for an example in Vue: Creating a widget is as easy as creating a Vue page in Vue / Astro project. We will be providing more examples in other frameworks later.

Everything the AI Agents need in one package

For example, if you create a plugin for integrating with an invoicing SaaS software that you provide, you might build:

• A couple of Tools:
  • One for creating an invoice
  • Another for listing all invoices with their status
• A Skill for explaining how invoices should be created with all the regulatory requirements and how they will be sent, e.g. if they need an approval (for security) in your own UI
  • Agent Skills standard is defined in https://agentskills.io/ and supported by most advanced AI tools
• A Widget for displaying the invoice as it would be shown as PDF / print-out
• Couple of Agents
  • One that creates an invoice based on text or voice input in interactive chat
  • Another as an autonomous agent that monitors invoices and sends a report for those that have not been paid by the due date
• A prompt that asks the user in interactive chat the minimum questions for creating a new invoice instead of user writing the initial text without any guidance.

We make creating these artifacts very easy:

• A Tool is just a TypeScript function, we will automatically create Model Context Protocol Service (MCP) and wire the function as an MCP Tool
• A Widget is just an Single Page Application with your favourite framework: Vue, React, Svelte etc.
• An Agent is just a markdown or JSON file.
• A Skill is just a folder with markdown files with other assets.
• A prompt is a very simple TypeScript function where all input parameters are just text returning the instruction text to the agent.

Basically all AI agents now consume MCP Tools, so that is all good, but support for MCP Apps widgets is still limited and even with skills, you have an issue that there is no consistent way of updating them as you make changes and fixes.

We solve a lot of these issues by for example packaging Agents, Tools, Widgets and Skills as Claude Plugins, that you may optionally publish. This allows Claude users to connect to only one plugin and get all artifacts on one go. Also, this allows for automatic updates for all of these artifacts including the skills. ChatGPT Plugins provide a similar functionality, but at the moment without the Agents. You can however manually copy-paste the Agent definitions / prompts to ChatGPT as to basically any other agent framework.

In the picture below, all the blue components will be generated by Quartal Plugins infra from your business logic and code so you do not need to worry about it:

... plus everything for Software devs from same source

MCP Tools are great for AI Agents, but when you are creating an app or integration, either "vibe coded" or by professional developers, you really want to connect to a real API. For this, we automatically create an Open API compatible rest API with full documentation to developers. We also expose the UI widgets as Web Components that may be easily integrated to any web UI. We generate documentation about all this as:

• Docs for human developers
• Integration Skill for vibe / engineering agents -- added besides business skills developed by you.
• Swagger UI for testing the API endpoints
• Widget tester for testing the UI widgets

As many Vibe coding tools (e.g. Lovable) do not support Agent Skills, we provide a separate MCP Tool endpoint for browsing skills content. Skills content is also linked to the Docs for human or agent usage.

Security and Authentication

You may provide your plugin as anonymous if your tools do not require any authentication, but often you need to authenticate the user to connect to external systems. For this we provide standard OAuth2 authentication mechanisms that will then be wired through:

• MCP Tools and Widgets
• Open API
• Web Component
• Test UIs: Swagger and widget tester

We provide out-of-the box authentication support using our Quartal IAM which recognizes out-of-the-box individuals and companies in Finland from authorities so that you can truly authenticate your users as companies. But you may also use any OAuth2.1 compatible authentication solution (as specified in the MCP spec).

Note that at least in the current version, Skills, Agents, plugin source code and documentation are always anonymous: you should place any confidential data inside Tools instead of embedding it into Skills or Agents. This is also generally the best practice.

Deploy your plugin

When you have tested your plugin, you deploy it as a dynamic Astro web site to any modern hosting platform. From there anyone can already use the plugin. You may optionally publish your package to NPM or JSR package registries. This allows developers to use your Tools directly in their code without the http overhead from their server to you published server.

Publish in Quartal Hub

After deployment, you may register your plugin in Quartal Hub which is a registry for plugins and an easy place for:

• Users to discover plugins
• Test them with authentication
• Manage plugins and authorize them to agents and users within their organization

Open Source and Zero Lock-in

Quartal Plugins is an open source project with MIT license. It is based on Astro (also MIT) and can be easily deployed to any modern hosting platform. UI Widgets can be created using any of your favourite UI framework such as React, Vue, Svelte, Plain JavaScript, and more.

Capabilities

We make it as easy as possible to provide a set of business functionality in one simple package:

• Tools: Reusable code that can be executed by agents and software via:
  • MCP Tools by AI agents
  • Open API / REST service by agents, vibe coded software and other services
  • NPM or JSR packages in TypeScript / JavaScript code, if published to NPM/JSR.
• Widgets as defined by MCP Apps standard
  • Provide user interfaces to interactive chat agents like Claude or Chat GPT
  • We will probably provide a way to use them from React and Vue etc. apps as well
• Agent Skills that guide AI agents on how to use these tools and other business logic
• Agents as defined by Claude plugins.
  • Currently supported for Claude and our internal Quartal Hub product only
  • We try to add support for other platforms later (PRs are welcome)
• Prompts as defined in MCP

We create extensive documentation pages for all the above services. As part of that process, we also serve all the files and folders in the /public folder the same way as public folder is shown in Vue apps.

Contributing

See CONTRIBUTING.md for instructions if you wish to contribute to our project.

As we are early in the release cycle we only take issues and bug reports from partners that work directly with us. We expect this to change by the end of 2026.