🎨Canvas
Canvas empowers you to build professional websites and dApp frontends without writing a single line of code. By translating your ideas into functional, beautiful UIs, Canvas bridges the gap between concept and creation.
From Prompt to Production
Canvas's workflow is elegantly simple:
Prompt: Describe the website you want to build. Be as descriptive as possible, including branding, color schemes, sections (e.g., "Hero, Features, Team, Roadmap"), and desired style (e.g., "modern, minimalist, dark mode").
Generate: The AI interprets your prompt and generates a complete website or dApp structure using standard web frameworks like React/Next.js.
Refine & Preview: The generated project appears in a dual-split environment. You can see the code on one side and a live preview of the UI on the other. You can then ask the AI to refine elements: "Change the primary button color to blue" or "Add a contact form to the footer."
Deploy: Once you're satisfied, deploy your site directly to our integrated hosting with a single click.
Guide: Generating Your dApp Frontend
Open Canvas: Launch Canvas from the AIDE dashboard.
Start a New Project: Click "Create New Project".
Enter Your Prompt: In the prompt box, describe your dApp. For example: Create a dApp frontend for a staking platform. It needs a "Connect Wallet" button in the navbar. The main section should show the user's staked balance, the total amount staked in the contract, and the current APY. Include "Stake" and "Unstake" buttons with an input field for the amount.
Specify Contract Details: Canvas will ask for the smart contract address and ABI to enable interaction.
Generate and Customize: The AI will generate the dApp. You can then use the live editor to customize text, images, and styles, or use further prompts to add new features.
Deploy: Click "Deploy" to publish your live dApp.
Last updated