Skip to content
BionicAdri

Canvas

Canvas: create pages and websites with AI and edit them without coding

The Canvas is the design panel of the chat with ADRI. You ask it for a page, you see it instantly, you edit it with the mouse or with instructions, and you share it with a link. It's for anyone who needs a website or a landing page without setting up a project.

What it is

A canvas next to the chat to view and tweak what ADRI creates

When you ask ADRI for a page, a landing page or a script, the result opens in the Canvas, a panel to the right of the chat. There you see it as a visitor would, you change it with the mouse or with natural language instructions, and you save it in the conversation space.

It opens only when ADRI generates a web file, or manually from any file in the chat. With the + button in the message box you can also create a web canvas from scratch. You can drag the bar that separates it from the chat to make it wider or narrower.

Create

Ask ADRI for the page you need

  1. Describe it

    “Make a landing page for my English academy with prices and a contact form.” ADRI designs the page and leaves the HTML in the workspace.

  2. View it

    The Canvas opens it with its preview. Change the width between mobile, tablet and desktop, or use split view to see three sizes at once.

  3. Request changes

    “Make this button blue”, “add a questions section”. Each change ADRI makes is saved as a version.

The preview loads the CSS, JavaScript and images alongside the HTML, like a browser. That's why you don't need to put everything in a single file. If you link a CSS from the internet it may not load: leave the styles in the workspace.

Designer mode

Edit without touching code

Pre-designed blocks

19 blocks in 12 categories (headers, heroes, pricing, FAQs, forms, footers…). One click inserts it into the page.

Complete templates

Four starting points: product landing page, portfolio, dashboard home and blog homepage.

Direct editing

Turn on Edit, click on some text and type. When you finish, it's saved.

Inspect

Click any element and you see its selector, its dimensions and its styles. From there you can ask ADRI for a change to that element only.

Images

Upload JPG, PNG, GIF, WebP or AVIF (up to 10 MB) or drag them into the panel, and they're inserted into the page.

Accessibility check

A notice flags images without alt text, empty links and fields without a label.

Real data

Your company data inside the page

You can write placeholders like {{ invoice.count.pending }} or {{ client.count }} and, with the Live button, the Canvas replaces them with your data: clients, leads, pending invoices, open tasks, your name or the date. It only reads your own records. This is what makes it possible to build a dashboard with real figures instead of example numbers.

SEO and versions

Look after the page and go back whenever you want

SEO and social

A form lets you edit the title, the description and the texts and image shown when sharing on social media.

Translate with AI

Translates the visible text into seven languages and saves each translation as a new file, without touching the original.

Version history

Every save, edit or change by ADRI creates a version. You preview it, compare it with the previous one and restore. Restoring is just another step in the history: it can always be undone.

Try and share

PHP and Python run in your browser

If ADRI creates a PHP website or a Python script for you, the Preview tab runs them inside your browser: you browse, submit forms, see the console and download what it generates. BionicAdri's servers don't run that code. In PHP the database is SQLite; MySQL and PostgreSQL aren't available. Flask, FastAPI and Streamlit applications also work.

To show it to a client, Share creates a public link that opens without signing in and lasts 1, 7, 30 or 90 days. It's a snapshot of the moment you create it, and you can revoke it whenever you want. It's a demo for trying things out: to publish a real website you need a server.

Price

From €275/month, AI included

You pay per seat: a seat is an AI task running in parallel, not a person, so there is no limit on users. The server where your data lives is chosen separately, from €100/month. Prices exclude VAT.

Frequently asked questions

What people usually ask us

Do I need to know how to code to use the Canvas?

No. You describe the page in the chat, see it in the Canvas and change it with your mouse or with instructions. If you know code, there's also an editor with the file open.

Can I use my own images and styles?

Yes. You upload images to the assets panel, and the workspace's CSS and JavaScript load in the preview just as they would in a browser.

Can I go back to an earlier version?

Yes. The history keeps the versions, with their origin (ADRI, manual or restored). You preview them, see the difference from the previous one and restore the one you want.

Does the site get published on the internet?

Not directly. The Canvas is for designing and testing. You can send a demo link that expires, but publishing the site for good requires a separate server.

Which languages can the preview run?

PHP and Python run live in your browser, with their limits: no MySQL or PostgreSQL, no connecting out to other websites and no desktop windows. For other languages, you ask ADRI to run it.

No-obligation demo

Tell us what page you need and we'll design it with you live

Tell us how you work today and we'll show you how ADRI would do it with your data. No obligation.

[email protected]+34 604 87 17 35