# Welcome to FlowCraft

![FlowCraft Logo](https://1348523582-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Ff12DXeB7tSMenBjJtxjK%2Fuploads%2Fgit-blob-bf93dbc81940290dcd2cf2e07288442cde01ef74%2Flogo.svg?alt=media)

#### From Design to Deployment: Craft Your Flow

[![GitHub](https://img.shields.io/badge/GitHub-FlowCraftLabs-blue)](https://github.com/FlowCraftLabs)[![Twitter](https://img.shields.io/badge/Twitter-@FlowCraftSol-1DA1F2)](https://x.com/FlowCraftSol)[![Documentation](https://img.shields.io/badge/Docs-GitBook-green)](https://flowcraft.gitbook.io)

## What is FlowCraft?

FlowCraft is an AI-powered platform that transforms your design mockups into production-ready code. Whether you're working with Figma designs, hand-drawn sketches, or wireframes, FlowCraft understands your vision and generates clean, responsive React components with Tailwind CSS.

## ✨ Key Features

* **🎨 Design Recognition**: AI-powered analysis of design files and wireframes
* **⚡ Code Generation**: Production-ready React + Tailwind components
* **🔄 Multi-Framework**: Support for React, Vue, Angular, and more
* **👥 Collaboration**: Real-time team workspace and version control
* **🚀 Deployment**: One-click deployment to major cloud platforms
* **🤖 AI Optimization**: Automatic performance and accessibility improvements

## 🚀 Quick Start

Get started with FlowCraft in minutes:

1. [**Install FlowCraft**](https://docs.flowcraft.bio/getting-started/installation) - Set up your development environment
2. [**Create Your First Project**](https://docs.flowcraft.bio/getting-started/first-project) - Build your first component
3. [**Learn Core Concepts**](https://docs.flowcraft.bio/getting-started/basic-concepts) - Understand FlowCraft fundamentals

## 📖 Documentation Sections

### 🏁 [Getting Started](https://github.com/FlowCraftLabs/docs/blob/main/getting-started/README.md)

Everything you need to get up and running with FlowCraft.

### 🛠 [Features](https://docs.flowcraft.bio/features/features)

Deep dive into FlowCraft's powerful capabilities.

### 📚 [Guides](https://github.com/FlowCraftLabs/docs/blob/main/guides/README.md)

Step-by-step tutorials and best practices.

### 🔧 [API Reference](https://github.com/FlowCraftLabs/docs/blob/main/api-reference/README.md)

Complete API documentation and SDK guides.

### 🎯 [Tutorials](https://github.com/FlowCraftLabs/docs/blob/main/tutorials/README.md)

Hands-on projects to master FlowCraft.

### 🗺 [Roadmap](https://github.com/FlowCraftLabs/docs/blob/main/roadmap/README.md)

See what's coming next in FlowCraft's development.

## 🌟 Why Choose FlowCraft?

| Traditional Workflow                          | FlowCraft Workflow              |
| --------------------------------------------- | ------------------------------- |
| Design → Manual Coding → Testing → Deployment | Design → AI Generation → Deploy |
| Hours of development time                     | Minutes to production           |
| Inconsistent code quality                     | Optimized, accessible code      |
| Manual responsive design                      | Automatic responsiveness        |

## 💡 Use Cases

* **Frontend Developers**: Accelerate component development
* **Design Teams**: Bridge the design-development gap
* **Startups**: Rapid prototyping and MVP development
* **Agencies**: Deliver projects faster to clients
* **Enterprises**: Standardize UI development workflows

## 🤝 Community & Support

* **GitHub**: [FlowCraftLabs](https://github.com/FlowCraftLabs)
* **Twitter**: [@FlowCraftSol](https://x.com/FlowCraftSol)
* **Community**: [Join our Discord](https://github.com/FlowCraftLabs/docs/blob/main/community/support.md)
* **Support**: [Get Help](https://github.com/FlowCraftLabs/docs/blob/main/community/faq.md)

## 📈 What's New

Check out our [latest release notes](https://github.com/FlowCraftLabs/docs/blob/main/roadmap/changelog.md) and see what we're building in our [roadmap](https://github.com/FlowCraftLabs/docs/blob/main/roadmap/README.md).

***

**Ready to transform your design workflow?**

[Get Started Now →](https://docs.flowcraft.bio/getting-started/quick-start)


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.flowcraft.bio/readme.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.