Complete Reference - Instruct UI

Purpose: Quick lookup for features, pricing, permissions, and troubleshooting

Feature Reference (A-Z)

Quick lookup for all Instruct UI features. For detailed guides, see Core User Guide or Advanced Features Guide.

Clone Conversation

What it does: Creates a copy of any conversation to use as a template or starting point

When to use:

• Creating variations for different clients (agencies/freelancers)
• Branching experiments without losing original work
• Building reusable templates

How to access: Click "Clone" button in conversation view or from History page

Credit cost: Free to clone; new generations in cloned conversation cost credits normally

Learn more: Clone Conversation Guide | Template Creation for Agencies

Code Diff Viewer

What it does: Shows exactly what changed between code versions with side-by-side comparison

When to use:

• Auditing AI changes for security/quality
• Learning how prompts translate to code
• Verifying specific modifications

How to access: Click "View Diff" when viewing version history

Credit cost: Free

Learn more: Core User Guide - Iteration & Refinement

Credit System

What it does: Usage-based billing where each generation consumes credits

Costs:

• 1 credit = Text-to-UI generation
• 0.5 credits = Fix with AI (compile or runtime)
• +1 credit = Image/screenshot attachment (additional)

How credits work:

• Recurring credits (monthly allowance) used first
• On-demand credits used second (if recurring exhausted)
• Pro/Team: Credits roll over up to 3x monthly allowance

How to access: View balance in top navigation; manage in Settings → Credits

Learn more: Core User Guide - Credit Management

Custom Instructions

What it does: Persistent instructions applied to all generations automatically

When to use:

• Enforcing design systems (colors, fonts, spacing)
• Coding standards (naming conventions, patterns)
• Accessibility requirements (ARIA labels, WCAG)

How to access:

• Personal: Settings → Profile → Custom Instructions
• Team: Settings → Account → Team Custom Instructions (admin only)

Character limit: 3000 characters

Credit cost: Free to set; applies to all generations

Learn more: Advanced Features Guide - Team Collaboration

Download as ZIP

What it does: Exports all generated code files to a downloadable ZIP archive

When to use:

• Integrating code into your production project
• Backing up work before risky experiments
• Sharing with developers outside Instruct UI

How to access: Click "Download" button in editor toolbar

What's included: All .razor, .cs, .css files with folder structure

Credit cost: Free

Code ownership: You fully own all generated code

Learn more: Core User Guide - Export & Reuse

Fix with AI (Compilation Errors)

What it does: Automatically attempts to resolve compilation errors in generated code

When to use: When code doesn't compile (red error messages in editor)

How it works:

1. AI automatically attempts fix (up to 2 times)
2. If errors persist, click "Fix with AI" button
3. AI analyzes errors and generates corrected code

How to access: Click "Fix with AI" button when compilation errors appear

Credit cost: 0.5 credits per attempt

Learn more: Quick Start Guide - Troubleshooting

Fix with AI (Runtime Errors)

What it does: Fixes errors that occur when interacting with the preview (not compilation)

When to use: Preview shows error message (null reference, event handler exceptions, etc.)

How to access: Click "Fix with AI" on the error shown in preview pane

Credit cost: 0.5 credits per attempt

Learn more: Core User Guide - Iteration & Refinement

Framework Selection

What it does: Choose which component library and CSS framework to use for generation

Options:

• MudBlazor (Material Design) - Best for enterprise apps, dashboards
• Tailwind CSS (Utility-first) - Best for custom designs, marketing sites
• Bootstrap (Classic web) - Best for familiar projects, quick MVPs

How to access: Dropdown in prompt area before generating

How to change: Select before each generation; last choice is remembered

Credit cost: Free to change; applies to generation

Learn more: Framework Selection Guide for detailed comparison and when to use each framework.

Invoices & Receipts

What it does: Downloadable transaction records for expense reporting and taxes

What's included:

• Transaction date/time
• Amount paid (itemized)
• Plan details
• Payment method (last 4 digits)
• Unique invoice ID

How to access: Settings → Subscription → View Invoices

Available to: Pro and Team plan users (paid plans only)

Learn more: Pricing Reference

License Management

What it does: Add/remove team member seats on Team plan subscriptions

When to use:

• Onboarding new team members
• Offboarding employees
• Managing contractor access

Pricing: Prorated billing for mid-cycle changes

How to access: Settings → Subscription → Manage Licenses (Team admin only)

Available to: Team admins only

Learn more: Advanced Features Guide - Team Collaboration

Live Preview

What it does: Real-time rendering of generated Blazor code in browser-like preview

Features:

• Interactive elements (click buttons, fill forms)
• Route navigation (test multi-page apps)
• Responsive width testing (drag to resize)
• View/edit toggle

How to access: Right panel in editor (auto-appears after generation)

Credit cost: Free

Learn more: Core User Guide - Understanding Your Workspace

Message Retry

What it does: Regenerates AI response to your last prompt with different randomization

When to use:

• Output went in completely wrong direction
• Want different creative interpretation
• Hoping for better result (not just refinement)

How to access: Click "Retry" button on your message

Credit cost: Same as original generation (1 credit)

Learn more: Core User Guide - Iteration & Refinement

See also: FAQ - Retry vs. New Prompt

On-Demand Credits

What it does: Purchase additional credits beyond monthly allowance

Pricing: $15 per 100 credits (25% discount from regular pricing)

Expiry: 12 months from purchase date

When to use:

• Ran out of monthly credits mid-project
• Large project requires more than allowance
• Spiky usage patterns

How to access: Settings → Credits → Purchase Credits (Pro/Team admin only)

Available to: Pro and Team plans (not Free trial)

Learn more: Advanced Features Guide - Credit Optimization

Screenshot-to-UI

What it does: Generates Blazor code from uploaded screenshots or design mockups

When to use:

• Client sent "build this" image
• Complex layout hard to describe
• Design handoff from designers
• Need exact visual match

How to access: Click image/attach icon in prompt area; upload screenshot

Supported formats: PNG, JPG, JPEG (max 2 MB)

Credit cost: 1 credit for image + 1 credit for generation = 2 credits total

Learn more: Core User Guide - Effective Prompting

Subscription Cancellation

What it does: Stops recurring billing for Pro or Team plans

How it works:

• Access remains until end of current billing period (no refunds)
• Data retained for limited time after cancellation
• Can resume before period ends without data loss

How to access: Settings → Subscription → Cancel Subscription

Available to: Pro users (own subscription), Team admins (team subscription)

Learn more: FAQ - Cancellation & Refunds

Text-to-UI Generation

What it does: Core feature - generates Blazor UI code from text descriptions

When to use: All UI creation tasks (forms, dashboards, pages, components)

Best practices:

• Be specific with details
• Mention data context
• Include layout requirements
• Iterate instead of over-prompting

How to access: Main prompt input on home page or editor

Credit cost: 1 credit per generation

Learn more: Core User Guide - Effective Prompting

Version History & Revert

What it does: View all code versions in conversation; revert to any previous version

When to use:

• Latest iteration broke functionality
• Client feedback: "Go back to version 3"
• Comparing different approaches

How to access: Click "History" or version dropdown in editor

How to revert: View desired version → Click "Revert to this version"

Credit cost: Free

Learn more: Core User Guide - Iteration & Refinement

User Types & Permissions

User Type Definitions

Feature Access Matrix

Legend:

• ✅ Full access
• ❌ No access
• 👁️ View only (cannot edit)
• * Pro users can cancel own subscription; team members cannot (only admin can cancel team subscription)

Upgrade Paths

Free Trial → Pro:

• Need data privacy guarantee (client work)
• Want to purchase on-demand credits
• Need private conversations
• Serious usage (not just learning/hobby)

Pro → Team:

• Hired team members who need access
• Want shared custom instructions
• Need team credit pool management
• Want admin controls for oversight

Monthly → Yearly:

• Used successfully for 3+ months
• Want cost savings (2 months free = ~17% off)
• Confident in long-term value
• Stable usage patterns

Pricing Reference

Plan Comparison

*Check pricing page for current rates (25% promotional discount currently active)

On-Demand Credits

• Price: $15 per 100 credits
• Discount: 25% off regular pricing
• Expiry: 12 months from purchase
• Available to: Pro and Team plans only

Current Promotion

25% off all plans (limited time)

FAQ & Troubleshooting

Getting Started

How do I sign up?

1. Visit the Instruct UI home page
2. Click "Try Instruct UI Free" or "Get Started"
3. Sign up using Google, GitHub, or email
4. Complete brief onboarding (name, company, industry)
5. You'll receive 15 free credits automatically

No credit card required for free trial!

What's included in the free trial?

• 15 one-time credits (no monthly renewals)
• Full editor access (preview, download, version history)
• All frameworks (MudBlazor, Tailwind, Bootstrap)
• Public conversations only (others may view)
• ⚠️ Data may be used for model training (no privacy guarantee)

How long does the free trial last?

There's no time limit - use your 15 credits at your own pace. However, you cannot purchase more credits until you upgrade to Pro or Team plan.

Billing

When am I charged?

• Free trial: Never (no credit card required)
• Pro/Team Monthly: On signup, then monthly on the same date
• Pro/Team Yearly: On signup (full year upfront), then yearly
• On-demand credits: Immediately upon purchase

Can I get a refund?

No refunds as stated in our policy. However, exceptions may be considered for exceptional circumstances - contact support if you have a special situation.

How do credits roll over?

Pro and Team plans only:

• Unused monthly credits roll over to next month
• Maximum rollover: 3x your monthly allowance
• Example: 100 credits/month → can accumulate up to 300 credits
• Credits reset to monthly allowance if you exceed 3x cap

Free trial: Credits do not renew or roll over.

What happens if I cancel mid-billing period?

• Subscription remains active until end of current period (you already paid for it)
• No partial refunds
• Access continues until period ends
• Data retained for limited time after period ends
• Can resume before period ends without data loss

Features

Can I generate React code?

No. Instruct UI only generates ASP.NET Core Blazor code (.razor components with C# and CSS).

Blazor is Microsoft's framework for building interactive web UIs with C# instead of JavaScript.

Do you support Figma?

Yes! Team admins can connect Figma via OAuth integration.

Once connected, you can paste Figma frame URLs directly into prompts to generate code from Figma designs. This is more accurate than screenshots.

Learn more: Figma Integration Guide

Can I use my own component library?

Not currently. Instruct UI supports:

• MudBlazor (Material Design)
• Tailwind CSS (utility-first)
• Bootstrap (classic web)
• Default Blazor components

Additional frameworks (Syncfusion, Telerik) are planned for future releases.

Is there a file size limit?

• Screenshots: 2 MB maximum
• Generated code: No limit (determined by AI generation)
• Custom instructions: 3000 characters maximum

Can I collaborate in real-time?

No real-time collaboration (like Google Docs). However, team members can:

• View each other's workspace conversations
• Clone conversations to customize
• Share credit pool
• Use team-wide custom instructions

Technical

My code won't compile

Automatic fixes: The AI automatically attempts to fix compilation errors up to 2 times.

Manual fix:

1. Click "Fix with AI" button
2. AI analyzes errors and generates corrected code

Common causes:

• Syntax errors (AI auto-corrects)
• Type mismatches (AI resolves)
• Incorrect Blazor syntax usage

If errors persist after 3-4 fix attempts, try rephrasing your original prompt with more specific requirements.

The preview shows an error

This is a runtime error (not compilation). The code compiled successfully but crashes when you interact with it.

How to fix:

1. Read the error message in preview pane
2. Click "Fix with AI" on the error (costs 0.5 credits)
3. AI analyzes stack trace and generates fix

Common causes:

• Null reference errors (missing null checks)
• Event handler exceptions
• Data binding issues

I can't download the ZIP

Possible causes:

1. Pop-up blocker: Allow pop-ups for Instruct UI domain
2. Browser issue: Try different browser (Chrome, Edge, Firefox)
3. Network issue: Check internet connection
4. Code hasn't compiled: Ensure no compilation errors before downloading

If problem persists, contact support.

How do I integrate downloaded code into my Blazor project?

Basic integration:

1. Extract ZIP file
2. Copy .razor files to your project's Pages/ or Components/ folder
3. Copy .cs files to appropriate folders
4. Copy .css files to wwwroot/css/ or use scoped CSS
5. Update namespaces to match your project
6. Register services in Program.cs (if needed)
7. Replace mock services with your real implementations

Learn more: Core User Guide - Integration Workflows (section coming soon)

Account

How do I add team members?

Team admin only:

1. Go to Settings → Subscription
2. Click "Manage Licenses" or "Add Team Member"
3. Enter email addresses
4. Send invitations
5. Team members accept invitation and join

Pricing: Each license costs per user/month (prorated for mid-cycle additions)

How do I cancel my subscription?

Pro users (own subscription):

1. Go to Settings → Subscription
2. Click "Cancel Subscription"
3. Confirm cancellation

Team members: Only team admin can cancel team subscription (you cannot cancel yourself)

After cancellation:

• Access continues until end of current billing period
• No refunds
• Data retained for limited time
• Can resume before period ends

Can I export my data?

Yes. You can download all generated code as ZIP files.

What you can export:

• All code files from any conversation (Download button)
• Conversation history (manually via screenshots/copy-paste)

What you cannot export:

• Credit usage data (view only in Settings)
• Team member data (admins view only)

For data portability, download your code regularly and store in version control.

Troubleshooting

Common issues and their solutions. For feature-specific questions, see the FAQ sections below.

My code didn't compile

What you'll see: Red error messages in the editor

How to fix:

1. Wait 10 seconds - the AI automatically attempts to fix compilation errors (up to 2 times)
2. If errors persist, click the "Fix with AI" button (costs 0.5 credits)
3. The AI will analyze the errors and generate a fix

Common causes: Missing dependencies, syntax errors (AI usually fixes these automatically)

See also: Fix with AI - Compilation Errors

I don't like the generated output

You have several options:

Option 1: Retry (same prompt, different result)

• Click the "Retry" button on your message
• The AI will generate a new interpretation
• Useful when the direction is completely wrong

Option 2: Refine with a follow-up prompt

• Add more specific instructions
• Example: "Make the buttons larger" or "Use a card layout instead"
• Better for targeted improvements

Option 3: Use a different framework

• Try generating the same prompt with MudBlazor, Tailwind, or Bootstrap
• Different frameworks have different aesthetics

See also: Message Retry | Effective Prompting

The preview shows an error

What you'll see: Error message in the preview pane (not the editor)

How to fix:

1. Read the error message - it usually tells you what went wrong
2. Click "Fix with AI" on the error (costs 0.5 credits)
3. The AI will fix the runtime issue

Common causes: Null reference errors, event handler issues, missing data binding

See also: Fix with AI - Runtime Errors

I can't find my generated code

Where to look:

1. Click "History" in the navigation
2. Your conversations are listed with timestamps
3. Click any conversation to reopen it
4. Use the search to find specific projects

Tip: Rename your conversations with descriptive titles (click the title to edit). Instead of "New Chat," use "Client X - Dashboard" or "User Profile Page."

See also: Edit Conversation Title

I ran out of credits

What happens:

• You can't generate new UIs
• You can still view, download, and clone existing conversations

What to do:

1. Upgrade to Pro for monthly recurring credits
2. Wait if you're on a paid plan - credits renew monthly
3. Purchase on-demand credits for immediate top-up (Pro/Team plans only)

Visit Settings → Subscription to upgrade or purchase credits.

See also: Credit System | Credit Management

When Should I Use...?

Retry vs. New Prompt?

Cost: Both cost 1 credit

Retry vs. Revert Version?

Cost: Retry costs 1 credit; Revert is free

Screenshot vs. Text Prompts?

Cost: Screenshot costs 2 credits (1 for image + 1 for generation); Text costs 1 credit

On-Demand Credits vs. Upgrade Plan?

Cost: On-demand = $15 per 100 credits (expires 12 months); Plans include monthly recurring credits with rollover

Need More Help?

• Quick Start Guide - Get started in 5 minutes
• Core User Guide - Essential workflows and best practices
• Advanced Features Guide - Team features and optimization
• Contact Support - Visit our Contact Page for help

Document Version: 1.0 Last Updated: 2026-01-07