📚Tutorials

Learn HTFlow

Step-by-step guides to help you master AI-powered website generation and Webflow integration.

Getting Started

🚀

Quick Start Guide

Create your first AI-generated section in under 5 minutes

5 minBeginner
💰

Understanding AI Credits

Learn how credits work and optimize your usage

3 minBeginner
⚙️

Account Setup & Settings

Configure your workspace and preferences

4 minBeginner

Webflow Integration

🔌

Installing the Webflow App

Set up HTFlow in your Webflow Designer

3 minBeginner
📋

Copy to Webflow Workflow

Generate sections and paste directly into Webflow

5 minBeginner
🎨

Importing CSS Classes

Transfer your styles to Webflow automatically

4 minIntermediate
🖼️

Image Asset Management

Import generated images to Webflow assets

3 minBeginner

AI Generation

✍️

Writing Effective Prompts

Get better results with prompt engineering tips

8 minIntermediate
📸

Using Reference Images

Upload designs to guide AI generation

5 minIntermediate
🔄

Iterating on Designs

Refine generated sections with follow-up prompts

6 minIntermediate
🤖

Model Selection Guide

Choose between GPT and Gemini for different tasks

4 minAdvanced

IDE & Extensions

💻

VS Code Extension Setup

Use HTFlow directly in Visual Studio Code

5 minIntermediate
🔗

MCP Integration for Claude

Connect HTFlow to Claude Desktop

6 minAdvanced
🌐

Chrome Extension Guide

Extract designs from any website

4 minBeginner

Advanced Features

🏗️

Building Full Websites

Create multi-page sites with consistent styling

15 minAdvanced
📐

Style Guide Generation

Create design systems for your projects

8 minAdvanced
👥

Team Collaboration

Share workspaces and manage team access

5 minIntermediate

Ready to start building?

Put your knowledge into practice. Create your first AI-generated website today.