Kiro - FormBnB Documentation

Setup

Install the FormBnB skill in your project:

npx skills add formbnb/agent-skills -a kiro-cli

This creates a SKILL.md file in .kiro/skills/ that Kiro loads automatically.

Verify Installation

npx skills list

You should see formbnb listed under Kiro CLI.

After installing, if you’re using Kiro’s custom agents, add the skill to your agent’s resources in .kiro/agents/<agent>.json:

{
  "resources": ["skill://.kiro/skills/**/SKILL.md"]
}

Usage

Once installed, Kiro knows how to create FormBnB forms. Use it in chat or let it work through specs:

In Chat

Add a contact form to the homepage that submits to FormBnB

With Specs

When building a feature with Kiro’s spec system, mention FormBnB in your requirements:

The contact page should include a form that submits to FormBnB for backend handling.
Include name, email, and message fields with spam protection.

Kiro will generate the implementation tasks with FormBnB integration built in.

Autopilot Mode

In autopilot mode, Kiro can build entire form flows end-to-end:

Create a complete contact page with a FormBnB form, success state,
and a webhook handler that sends submissions to Slack.

Examples

React form with hooks:

Create a useContactForm hook that submits to FormBnB and returns
loading, success, and error states. Then build a ContactForm component using it.

Form with file uploads:

Add a job application form with resume upload. Use FormBnB for the backend.
Accept PDF and DOCX files.

Full-stack form flow:

Build a feedback form that:
Submits to FormBnB
Shows a success animation
Sends a webhook to our API
The API route verifies the FormBnB signature and saves to the database

Tips

The skill activates on form-related files (.html, .tsx, .jsx, .vue, .svelte, .astro)
Works in both chat and spec-driven development
Kiro’s steering files can reference FormBnB docs for consistent form patterns across your project
For global installation: npx skills add formbnb/agent-skills -a kiro-cli -g

​Setup

​Verify Installation

​Usage

​In Chat

​With Specs

​Autopilot Mode

​Examples

​React form with hooks:

​Form with file uploads:

​Full-stack form flow:

​Tips

Setup

Verify Installation

Usage

In Chat

With Specs

Autopilot Mode

Examples

React form with hooks:

Form with file uploads:

Full-stack form flow:

Tips