Style-guide awareConvex backedTailwind HTMLExport-ready

One workspace for moodboards, AI generation, and the canvas.

Draftly stores your references, style guide, and frames in the same project. Upload a screenshot, stream semantic HTML to the infinite canvas, and ask the built-in copilots to iterate—no slides, no fake promises.

Open Draftly See what's inside10 credits included · Exports anytime

Projects per workspace

Unlimited

Included AI credits

10 / mo

Built-in copilots

draftly.live/workspace

Convex sync active

Inspiration board

Stored in Convex · Private to project

Draftly learns palette + typography from every reference.

Tokens ready

CanvasHTML export

PROJECT

Sales Ops workspace

Palette + typography pulled from the style guide. Every block uses Tailwind classes you can copy immediately.

Click any frame to edit text or duplicate layouts.

AI generation log

$ draftly generate ui --project sales-ops

> loading style-guide tokens......... done
> inspiration images attached: 3
> uploading screenshot: dashboard.png
> credits consumed: 1 (remaining: 9)

✔ streamed HTML to canvas
  - frame: Revenue Overview
  - workflow placeholder attached

Tip: open Design Chat to request spacing or color tweaks.

Everything that ships inside Draftly today

Projects hub

Create, rename, archive, and restore projects without leaving the dashboard. Everything syncs through Convex so nothing gets lost.

Unlimited projects with autosaved thumbnails
Role-gated access before the canvas opens

Moodboard & style guide

Upload up to six inspiration images, let Draftly extract palettes and typography, and reuse the tokens in every generation.

Images stored privately in Convex storage
Color + type scales editable inside the app

Infinite canvas

Frames, rectangles, text, arrows, and freehand drawing ship today. Edit copy with a sidebar and keep multiple frames per project.

Selection, duplicate, undo/redo, and export
Inspiration sidebar appears automatically on new frames

AI copilots

One-click generation, workflow extensions, and the redesign chat all live beside the canvas so you never juggle tabs.

1 credit streams a brand-new UI from your screenshot
4 credits run a full redesign via chat with history

Workflow

The exact path Draftly follows inside the product.

Every step below is live right now: capture references, stream UI onto the infinite canvas, and keep iterating with the built-in copilots. Credits refresh monthly so you always know what each action costs.

1. Collect

Capture your context

Drop images into the inspiration board and turn them into a reusable palette + typography scale for the project.

Upload up to 6 images per project
Generate colors & type straight from the moodboard

2. Generate

Stream UI onto the canvas

Send screenshots or frames to the AI generator, then review the HTML + Tailwind markup directly inside the infinite canvas.

1 credit per brand-new generation
Frames save to the project history automatically

3. Refine & ship

Iterate with copilots

Open the redesign chat or trigger the workflow generator to build additional pages that stay consistent with your style guide.

Chat-based redesign costs 4 credits
Workflow companion pages cost 1 credit

Context stays attached to the project

Moodboards, style guides, and generated UI live in the same Convex document so you never have to re-upload assets between sessions.

Inspiration board opens automatically on new frames
Tokens regenerate on demand from the same images

Transparent credit meter

The billing page gives you 10 credits every month.

The billing page gives you 10 credits every month. Each AI task removes a known amount so there are no surprise charges.

1 credit = new UI generation or workflow page
4 credits = full redesign via Design Chat

Pricing

A single plan with clear credit usage.

Draftly currently runs on one paid plan. You get unlimited projects, moodboards, and canvas sessions plus 10 AI credits every month. Extra credit packs unlock from the same billing screen soon.

Available now

Standard

Built-in plan

$20/month

Everything in the current app: projects, moodboards, canvas, AI generation, and exports.

Unlimited projects & inspiration boards
10 AI credits each month (auto-refresh)
Generate UI, workflows, and run design chat
Export semantic HTML + Tailwind classes

Enterprise

Coming soon

On request

Need more than 10 credits per month? Extra usage tiers unlock from the same billing screen soon.

Priority access to higher credit packs
Shared billing across teams
Self-hosted option
Dedicated support SLA

Credit usage

Generate new UI from a screenshot

1 credit

Create a workflow companion page

1 credit

Full redesign via Design Chat

4 credits

Included forever

Unlimited projects, frames, and exports
Moodboard uploads + style guide generation
Canvas tools, selection, undo/redo, PNG export

Manage billing anytime inside the protected /billing route.

FAQ

Answers to common questions

Sign in, open a project, and start generating inside Draftly.

Projects, inspiration boards, style guides, infinite canvas tools, and three AI copilots already live in the app. No marketing-only sections—everything you saw above is what you get today.

Open Draftly View pricing10 credits included · Unlimited projects

Live generation log

$ draftly generate ui --project sales-ops

> loading style-guide tokens......... done
> inspiration images attached: 3
> uploading screenshot: dashboard.png
> credits consumed: 1 (remaining: 9)

✔ streamed HTML to canvas
  - frame: Revenue Overview
  - workflow placeholder attached

Tip: open Design Chat to request spacing or color tweaks.

Credits used1

Remaining this month9

Output formatHTML + Tailwind