Change text and images. Spend zero credits.
Double-click to edit, see it instantly, and the change lands in your project's code. AI credits are reserved for what actually needs AI — layout changes, new modules, bulk refactors. Everyday copy edits cost nothing.
Direct answer
Does editing content in Creght cost credits?
Changing text, swapping images, and adjusting component properties consume no credits at all. Double-click text on the canvas to edit it in place; an element panel opens alongside, and its Direct edit section covers everything on that element you can change — if there is an input for it, that change is free.
Only the AI instruction section consumes credits, and it exists for changes that are faster to describe than to make by hand: layout changes, new modules, bulk refactors. Both sections sit in the same panel, so what costs credits is visible at a glance.
The canvas shows the finished result immediately — no build, no waiting on AI, no preview to refresh.
The problem
Fixing a typo should not be a budgeting decision.
Copy and images are what you change most after launch. If every edit has to pass through AI, fixing a typo and rebuilding a section draw on the same budget.
| Without Creght | With Creght |
|---|---|
| Fixing one typo runs an AI request and spends credits. | Double-click and type. No credits at all. |
| Install Node, install dependencies, run a dev server first. | The browser is the editor. Nothing to install. |
| Wait for the build and refresh to see whether it worked. | In-place editing applies instantly — Enter to save, Esc to cancel. |
| Visual tools export a copy of the code, and the live site drifts from it. | What you edit is the site itself. There is no second copy to reconcile. |
How it works
How far the free path goes
Double-click to edit — no credits
Double-click any text on the canvas to edit it in place; an amber outline appears, Enter saves and Esc cancels. Text and image changes never go through AI, so they never spend credits — and those are exactly the edits you make most often.
Double-click to edit in place
Summer collection
Enter saves · Esc cancels · no credits
The code changes with it
/pages/Index.tsx
<h1>Summer</h1>
+ <h1>Summer collection</h1>
A colleague who pulls the project locally sees exactly what you changed.
Every component property is directly editable
Select a component — a pricing card, a carousel, a button — and the element panel lays out each of its properties as its own input. The rule is simple: if the Direct edit section has an input for it, changing it is free.
Summer collection
Light fabrics and earth tones — twelve pieces for the season.
Element properties
Hover shows the tag name and a selection box; click to adjust in the inspector.
True WYSIWYG, with no waiting
No build step, no compile, no waiting on AI, no separate preview to refresh — the canvas is the finished thing, and what you see is what visitors get once you publish.
Design
Summer collection
Code
<h1 className="text-5xl font-semibold">Summer collection</h1>
Preview
Summer collection
The same heading in all three modes: selectable on the canvas, one line of JSX in code, rendered in preview.
AI is for the harder changes
Layout changes, new modules, and bulk refactors are faster to describe than to do by hand — those go through the AI instruction section, which consumes credits by usage. Both sections sit in the same panel, so the cost is never a surprise.
AI instruction
Make this headline punchier and a bit larger
/pages/Index.tsx
<h1 className="text-5xl font-semibold tracking-tight">
What the inspector cannot reach, say in a sentence — or switch to code mode.
Related docs
Step-by-step guides
Generate a site, then refine it for free.
Describe what you need and let AI build it. Every copy and image change after that costs nothing.