Skip to main content
vibld
Sign up for the beta
Menu

← All guides

Using vibld

Getting started

Checked against the product on

vibld turns a description of an application into a real project: a conventional codebase in files you can read, running on a stack you already recognize.

1. Sign in

The builder is at app.vibld.com. Accounts are email and password or a linked provider. Nothing in the builder mounts until you are signed in.

vibld is in public beta, and anyone can sign up at app.vibld.com/sign-up. A new account starts with $0.20 of model spend to try it, about two builds. Adding a card makes that $1.00 every month: the Add a card button above the composer opens a Stripe page that saves the card and charges nothing. A card counts for one account.

2. Describe what you want

The composer is the message box under the conversation. Write what the thing is, who uses it, and what it has to do. Specifics help more than adjectives: “a booking page for a two-chair barbershop, with a week view and an email confirmation” produces a better first pass than “a modern booking app”.

Under the message is a row of options. Each opens a panel in place, and one that is set says so on its button:

  • Style is a visual direction from the style catalog. A row of moods (luxe, calm, technical, organic, playful, brutal) narrows the list, and the styles whose moods your message names are listed as Suggested for your request. Nothing is picked for you. A moving background is asked for in the message instead: say “animated background”, or name one (aurora, particles, grain, flowing lines), and the build can use one of four that vibld draws in code from the project’s colors.
  • Gallery is one of the complete styles in the style gallery, filtered by theme, look and industry. A gallery style replaces the style above: the build writes its colors, typefaces, type scale, corners and shadows into the site as tokens. Its colors can be changed there, and a change that breaks one of the style’s contrast pairs is not applied.
  • Templates is the template catalog, searchable by name and sorted by category (Websites, Apps, App screens) and subcategory, the gallery styles among them. Adding one puts its brief in your message, as “Start from this template” on a template’s page does.
  • Reference is the address of a page to start from. vibld reads its text, colors, fonts and spacing and adapts them rather than copying. It goes with the message it is sent with, and the field clears once that message is sent.
  • Media is your images and video (JPEG, PNG, WebP, AVIF, GIF, MP4 or WebM), placed wherever your request calls for them. There is one library per account, shared by all your projects.
  • Preferences holds Project instructions, anything you would otherwise repeat in every message (the company name, a rule about how dates are formatted), and Look, a few visual preferences. Both apply to every message, and what you type in a message wins.

The model is the dropdown beside the send button. Which models are offered depends on the deployment and on your plan: a Free account builds with GPT-6 Luna only. Beside the send button, the composer shows what a build on that model is expected to cost, from the last 30 days of builds on it, or the most it can cost, as “Up to”, when there are too few. A project's first build also includes the most its draft can cost. The settings menu, under This deployment, reports which model actually served the last run rather than which one was requested.

3. Talk to it, or have it build

The button says Generate for the first message and Send after that. For each message the agent either answers in words and changes nothing, or builds. Before the first build it may ask one or two questions, and a reply such as “yes” is turned into the full brief the two of you agreed, not sent on as the word.

Before the first build there is also Show me three directions: three quick sketches that differ in look, for about a tenth of the cost of a build. Pick one and the build starts from it.

There is no step where you accept a build. While a first build runs, the Preview tab shows a draft of the page, labeled as one. The code is shown as soon as it exists, badged Checking the build while vibld installs and builds it, and Fixing a problem while one repair runs. The badge goes when the check passes. Does not build means the check failed: that version is still your current one, and you can ask for a fix. Not checked means the check could not finish.

A build keeps going if you close the tab, lock your phone or reload, and reopening the project picks up the result. Only Cancel stops it, and a canceled build is charged for what it used up to that point.

Iterating is another message in the same conversation. A follow-up sees the project it is editing, so “make the header sticky” means the header it already wrote, and it changes only the files it needs to.

4. Run it for real

Once something is built, the Preview tab offers Run live preview, which installs the project and starts it in a private sandbox so you can click through it. That is covered in Running and sharing your project.

What to read next