Platform
Blocks: one-click capabilities for serious AI software delivery
The hard parts of a real product — payments, auth, data, AI — arrive as governed capabilities you switch on, not weekends you lose.
Blocks are Ciao's one-click capabilities: payments, backend, Figma import, AI features and integrations that install into an application as real, editable code. Unlike marketplace plugins that bolt onto a closed platform, a Block becomes part of your codebase — wired into your data model, covered by QA and Guardrails, and owned by you like everything else Ciao generates.
Published 2026-07-03 · Last updated 2026-07-03
The hard parts, made installable
Every real product hits the same walls: it needs to take money, store data safely, sign users in, maybe answer questions with AI. None of these are what makes your product yours — but each one can consume weeks and introduce exactly the category of bug you cannot afford. In most app builders the answer is a plugin marketplace; the plugin works until you need it to do something slightly different, and then you discover you cannot open it.
Blocks are Ciao's answer: one-click capabilities — payments, backend, Figma import, AI features, integrations — that install into your application as real, editable code, wired into your data model and covered by the same QA, security testing and governance as everything else you build.
The blocks
Five capabilities cover most of what turns an app into a product.
Payments
Stripe-powered checkout, subscriptions and receipts, with separate test and live modes — connected to your own Stripe account.
Backend
Supabase-powered authentication, Postgres, file storage, row-level security and APIs — the data layer every serious app needs.
Figma import
Bring in designs and turn them into working screens backed by real data, refined in Builder.
AI features
Add assistants, summarization, extraction and other AI capabilities to your own product, running through Ciao's multi-provider model ladder.
Integrations
Connect the systems your business already runs on, with access rules and audit visibility applied.
How adding a block works
Adding a block is a change like any other — which is exactly the point.
1. Add it in one click
Pick the block and Ciao generates the code and wiring into your application — components, backend pieces, configuration.
2. It lands as code, on a branch
A block arrives like any change: branch-native, reviewable, undoable. Nothing is bolted on outside the codebase.
3. Configure in plain language
Describe your products and prices, your data model, your flows. The block adapts to your application rather than the other way around.
4. The gates apply
QA replays and security probes cover the new capability before it can publish — a payments flow gets tested like a payments flow.
5. Extend it like your own code — because it is
Inspect-to-prompt on a checkout page works exactly as it does on any other screen. Six months in, the block is just part of your product.
Why it matters
The difference between a plugin and a block is what happens six months in. A plugin is a boundary: your customization ends where its settings page ends. A block is a starting point: real code in your repository that grows with the product — and leaves with you if you export, because you own 100% of the code.
Blocks also keep the delivery loop honest. A payments capability that skipped review and testing would be the riskiest code in your application; here it is covered like everything else, and Guardrails treats the areas it touches as the protected zones they are.
Blocks are also how a workspace compounds. The second application does not start from zero: payments, backend and integrations are decisions already made, tested and governed once, then applied again. For an agency, that is margin; for an internal team, it is the difference between a backlog of requests and a portfolio of shipped tools.
Security and governance notes
- ✓ Blocks install as standard React, TypeScript and Supabase code you own.
- ✓ Every block lands on a branch and passes the same gates as hand-requested changes.
- ✓ Payments connect to your own Stripe account — funds flow to you.
- ✓ AI features run under zero-retention model contracts, like the rest of the platform.
- ✓ Integration credentials are stored per environment, never hardcoded into the generated code.
- ✓ Access rules and the append-only audit trail apply to block-added capabilities automatically.
Marketplace plugin vs Ciao block
The plugin model and the block model diverge the day you need something the settings page does not offer.
| Marketplace plugin | Ciao block | |
|---|---|---|
| What you get | A sealed component with settings | Real code in your application |
| Customization | Whatever the settings expose | Anything — it is your code |
| Testing | Trust the vendor | Covered by QA replays and security probes |
| Ownership | Ends with the platform | Exportable with the rest of your app |
| Governance | Outside your review process | Same Guardrails policies as any change |
Frequently asked questions
Are blocks editable, or sealed like plugins?
Editable. A block generates real React, TypeScript and Supabase code into your application, and from that moment it is yours to change — in conversation through Builder or directly in code.
Do blocks pass through review and testing?
Yes. A block lands on a branch like any change, Guardrails policies apply to the areas it touches, and QA replays and security probes cover the new capability before publish. Payments and auth get more scrutiny, not less.
Which blocks exist?
Payments (Stripe-powered), backend (Supabase-powered), Figma import, AI features and integrations. The payments, backend and Figma import blocks each have a dedicated page with the details.
What happens to a block if we export the code?
It exports with everything else. Blocks are standard code with no proprietary runtime, so the checkout, the backend and the integrations keep working in your own repository.
How do we start?
Self-serve with credits: build the app, add blocks as the product needs them. Serious production programs start at USD 10,000 per year — the pricing page has the details.