Vibe coding: why you should define your brand before asking AI for code

Vibe coding: building by describing what you want

Vibe coding describes a way of programming where you say what you want in plain language and an AI writes the code. The term was popularised in early 2025 by researcher Andrej Karpathy. You try it, react to what appears, ask for corrections, without necessarily reading every line.

For a founder, a freelancer or a small team, it is a real shift: a home page, an internal tool or an app prototype are built in a few hours. The bottleneck is no longer the code. It is knowing exactly what you want to show, and what it should look like.

The trap: a result that looks like everyone else’s

If you write “make me a nice home page for my startup”, the AI fills in the blanks with what it has seen most: a neutral font, a purple or blue gradient, rounded cards, a generic icon in place of the logo. The result is clean but interchangeable. People sometimes call it the “AI look”.

Every detail left vague is a choice you delegate to chance: the colour of the button, the weight of the headings, the tone of the error messages. One by one they seem minor. Together, they mean a customer does not recognise your brand from one page to the next, or from one tool to the next.

Why define your brand before coding

• More precise instructions. An AI follows “primary button #0EA5E9, headings in Sora 700, direct and warm tone” better than “make something modern”.
• Fewer back-and-forths. Every style correction (“change the colour”, “rounder”, “another font”) costs time and attempts. A defined base avoids most of them.
• Consistency across tools. Site, app, e-mails, documents, social: with the same colours and fonts, everything is recognisable, even when each piece was generated in a different session.
• A brand that belongs to you. A chosen, then protected, logo and palette (exclusivity and rights) are worth more than a randomly generated style you can never find again.
• Easier evolution. When colours and fonts live in one place, changing palette takes a minute instead of rewriting every page.

What to prepare before launching the AI

You do not need a forty-page brand book. A short base is enough, as long as it is written down and reusable.

Once these elements are set, turn them into variables (“design tokens”): --brand-colour, --heading-font, and so on. The generated code reuses them everywhere instead of repeating hard-coded values, and a brand change is made in a single place.

How to brief the AI with your brand

Put your identity at the start of the conversation, or in your tool’s instructions file, so that it applies to all the following requests. Here is a template to adapt:

Then check the result against this instruction: exact colours, right font, undistorted logo, tone respected. If the AI strays, recall the precise rule instead of asking again “but better”.

Common mistakes

• Starting to code without a logo or palette, then dressing the project at the end: everything has to be redone.
• Giving a screenshot instead of a vector file: the logo will be redrawn approximately (which format to choose).
• Describing moods instead of values (“cool”, “premium”): the AI interprets them its own way.
• Multiplying colours: beyond four or five, consistency disappears (the 60-30-10 rule).
• Forgetting accessibility: pretty light text on a light background is not readable (contrast and WCAG).
• Not reviewing what is generated: check at least the key screens, the legal notices and the texts your customers see.

Your checklist before you start

1. I know in one sentence who I serve and why.
2. I have a checked name, and an available domain (method).
3. I have a vector logo and a symbol alone for the icon.
4. I have a palette of 3 to 5 colours with their HEX codes and roles.
5. I have two fonts at most, with their weights.
6. I noted my tone of voice in three adjectives.
7. My colours and fonts are variables, not copied values.
8. My brand instruction is ready to paste at the start of a conversation.

A brand defined in an hour saves days of touch-ups, and gives the result something that generated code alone will never give: a recognisable identity. To go further on the substance, read our guide on the 8 elements of a brand image.

Frequently asked questions

What is vibe coding?

It is a way of creating software or a website by describing what you want to an AI, which writes the code, then adjusting as you go. The term was popularised in early 2025.

Can I do vibe coding without knowing how to code?

Yes for a prototype or a small tool. For a product used by customers, you need at least to review the important screens, test, and get help on security and personal data.

Why do my AI-generated pages all look alike?

Because the AI fills in missing instructions with the most common choices: the same fonts, the same gradients, the same cards. Giving your precise colours, fonts and rules is the best remedy.

What should I give the AI so that it respects my brand?

Your logo as an SVG, your colours as HEX codes with their role, your fonts and weights, your tone of voice and your don’ts, ideally as CSS variables and a written instruction at the start of the conversation.

Should I create my logo before or after my site?

Before. Logo, colours and fonts guide everything else; adding them afterwards means reworking the screens already generated.