Skip to main content

​
Overview

The ChatAndBuild chat interface is your primary way to interact with AI models for code generation, debugging, and development assistance. It combines the power of multiple AI providers in a unified, developer-focused experience.

​
Starting a New Chat

  1. Navigate to the main chat interface
  2. Select your preferred AI model from the model selector
  3. Begin typing your development question or request
  4. Press Enter or click the send button to start the conversation

​
Chat Features

Multi-Model Support

Choose from Claude, GPT-4, and other leading AI models for different types of tasks.

Code Generation

Generate complete applications, components, or code snippets through natural language.

File Integration

Upload files, import from GitHub, or reference existing code in your conversations.

Live Preview

See generated code running in real-time with integrated preview functionality.

Multi-language and voice imput

Multi-language and voice input support lets users interact naturally in their preferred language and speaking style, making the platform more inclusive and accessible.

Prompt Enhancer

Want to give your prompt more power? Use our ✨ Prompt Enhancer to rework and optimize it — but keep it simple for the first prompt.

​
Chat Controls

​
Voice Input

Enable voice input to speak your development requests:
  1. Click the microphone icon in the chat input
  2. Allow microphone permissions when prompted
  3. Speak your question or request clearly
  4. The speech will be automatically transcribed and sent
Voice input works best in quiet environments and supports multiple languages.

​
File Attachments

Attach files to provide context for your development requests:
  1. Click the attachment icon in the chat input
  2. Select files from your device or Drag and drop files directly into the chat area
Supports only images at the moment (png, jpg, webp etc.)
  1. Files are automatically analyzed and incorporated into AI responses
  2. Maximum file size limit applies per attachment
For best results with images, upload one image at a time to ensure proper analysis and context understanding.

​
Prompt Enhancer

Improve your prompts automatically for better AI responses:
  1. Type your initial prompt in the chat input
  2. Click the “Enhance” button that appears
  3. Review the AI-suggested improvements to your prompt
  4. Send your prompt with enhancements with one click or edit manually
  5. Enhanced prompts provide more context and clearer instructions

​
Chat History Export

Export your conversations for documentation and sharing:
  1. Click the export button in the chat input window
  2. Downloaded files preserve formatting, code blocks, and attachments
Share your chats with others or save them for future reference
Available exclusively with Paid Plans

​
Screenshot Capturing

ChatandBuild provides built-in screenshot capturing that integrates directly with your chat interface. Screenshots are automatically added to your chat context for AI assistance. Image Capture Pn
  1. Click the button shown in the picture, then choose Area for a screenshot
  2. The image is automatically added to your chat
  3. You’ll see a success notification

​
Conversation Management

​
Chat History

All your conversations are automatically saved and organized by:
  • Order: Most recently updated at the top, oldest at the bottom
  • Recent: Last 24 hours
  • Previous 7 Days: Past week
  • Previous 30 Days: Last month
  • Older: All previous conversations

​
Editing Chat Titles

  1. Open the chat menu in the sidebar
  2. Hover on the chat title - > Rename
  3. Enter a descriptive name for easy reference
or
  1. Open the chat
  2. Edit title on the top of the page

​
Deleting Chat

  1. Open the chat menu in the sidebar
  2. Hover on the chat title - > Delete
  3. Confirm by clicking “Delete”

​
Best Practices

​
Writing Effective Prompts

Instead of “Build a website”, try “Create a React website with a navigation bar, hero section, and contact form using Tailwind CSS”
Share relevant files, explain your project structure, or mention specific frameworks you’re using
For large projects, break them into smaller, manageable requests across multiple messages
AI models understand technical terms, so don’t hesitate to use specific programming terminology

​
Example Conversations

User: Create a React component for a user profile card with avatar, name, email, and a follow button

AI: I'll create a user profile card component for you...
For more advanced chat features, explore our guides on Model Selection and Prompt Engineering.