Prompting with Chronos-1

Chronos-1 is designed to transform natural language instructions into fully functional applications.
Your prompts define what gets generated, the clearer the request, the better the output.

How It Works

When you type a prompt, Chronos-1:

1. Analyzes your instructions
2. Generates all required files
3. Writes UI + logic + APIs as needed
4. Handles dependencies
5. Runs the development server
6. Updates the preview instantly

This enables you to build full applications without any manual setup.

1. Writing Effective Prompts

A strong prompt provides clarity, technical direction, and expected behavior.
Use the guidelines below to improve accuracy and output quality.

Be Specific

Avoid broad, vague requests.

❌ Bad:
“Build a website.”

✔️ Good:
“Build a landing page with a hero section, features grid, pricing table, and contact form using React and Tailwind CSS.”

Being specific tells Chronos-1 exactly what you expect.

Include Technical Details

Mention the technologies you prefer:

• “Use React with TypeScript”
• “Build the backend using Express.js”
• “Style the UI with Tailwind CSS”
• “Use Recharts for charts”
• “Set up routing with React Router”

These details guide the system toward your intended stack.

Specify Frameworks & Libraries

Build a dashboard using Next.js 14, TypeScript, shadcn/ui components, and Recharts for data visualization

Examples of useful hints:

• “Use Next.js 14 App Router”
• “Use Material UI components”
• “Use MongoDB with Mongoose”
• “Use Chart.js for analytics graphs”

2. Advanced Prompting Techniques

Chronos-1 is optimized for iterative, visual, and step-based workflows.
This section explains how to maximize those capabilities.

Iterative Development (Recommended)

Build your project in multiple steps rather than in one giant request.

Example workflow:

1. “Create the base layout for a todo app using React.”
2. “Add local storage persistence to save tasks.”
3. “Add drag-and-drop reordering using dnd-kit.”
4. “Add a dark mode toggle using Tailwind CSS.”

Working step-by-step gives the most consistent and controllable output.

Using Images for Context

Chronos-1 can interpret mockups, wireframes, and UI screenshots to generate precise UIs.

How to upload an image:

1. Click the attachment icon in the chat box
2. Select a mockup or screenshot
3. Describe your expected behavior or layout
4. Chronos-1 will rebuild the UI based on your image

Using images is highly effective for dashboards, landing pages, and anything requiring visual precision.

Multi Step Instruction Examples

Chronos-1 follows structured, numbered instructions extremely well.

Example 1: Portfolio Website

Bad: “Build a website.”

Good:

• Build a portfolio website using React + Tailwind:
• Hero section with profile image and intro text
• About section with skills grid
• Projects section with 6 cards
• Contact form with validation

Example 2: Weather App

Create a weather app with the following features:

1. Search for cities using a search bar
2. Display current weather with temperature and conditions
3. Show a 5 day forecast
4. Use the OpenWeatherMap API
5. Style with Tailwind CSS and use weather icons

Final Prompting Tips

• Be clear and descriptive
• Add technical requirements
• Use images for UI accuracy
• Break projects into steps
• Mention frameworks and libraries
• Iterate instead of asking for everything at once

Next Steps

Continue exploring core features:

➡ File Management
➡ Code Editing
➡ Terminal
➡ Live Preview