The brand.md File for Claude Code
Your AI-built site looks generic because Claude Code has no brand to follow. This is the one file that fixes it before a single line of design gets written.
What you'll walk away with
- The prompt that builds your brand file from six questions
- The CLAUDE.md rule that makes Claude read it every time
- Why reference sites are the biggest unlock for the look
Most AI-built sites look like slop because of one missing file. No brand, no consistency, just generic gradients and stock fonts on every page. Here is the file that fixes it before Claude Code writes a single line of design.
The file that fixes it
Here is what you will do:
- 1Open Claude Code in your project and paste the prompt below.
- 2Answer 6 quick questions about your colors, fonts, and vibe.
- 3Claude saves a brand.md file your whole project reads from on every conversation after that.
The prompt that writes it
Walk me through creating my brand.md file by asking these questions one at a time. Wait for my answer before moving to the next question. Suggest options and ideas for each so I am not starting from scratch.
1. Do I have any reference websites I love? If so, I will paste the URLs. If not, suggest a few based on my industry and let me pick.
2. What does my business or service do, and who is it for?
3. What vibe do I want my site to have? Suggest 3 to 4 options like clean and professional, bold and editorial, warm and approachable, or minimal and modern. Or let me describe my own.
4. Based on my answers, suggest 2 to 3 color palette options with hex codes. Show a primary color, a secondary color, a background, a text color, and an accent. Let me pick one or mix and match.
5. Suggest 2 to 3 font pairings (heading + body) that match the vibe. Use free Google Fonts only.
6. What sections should the site have? Suggest a structure based on everything above. Hero, services, how it works, testimonials, CTA, and so on. Let me add, remove, or reorder.
After I answer all the questions, generate a brand.md file at the root of my project with everything documented clearly. Include the colors with hex codes, the fonts, the voice and tone description, the section structure, and any other brand decisions we made together.
Then add a rule to my CLAUDE.md (or create one at the root of my project if it does not exist) that says "Always read brand.md before making any visual or UI decisions, and update brand.md when overall site styles change so it stays accurate."
After both files are saved, confirm what you wrote and tell me how you will use brand.md going forward.tap to copyWhat it actually does
That prompt walks you through your brand one question at a time. Colors, fonts, vibe, sections, voice. Then it writes brand.md to your project root and adds a rule into your CLAUDE.md so Claude reads from it on every single conversation after that.
Use it from here
Here is how to actually use it from here:
- 1Keep brand.md at the root of your project. Claude Code finds it automatically.
- 2Reference it whenever you ask for a UI change. Just say "follow brand.md" and the output stays on-brand.
- 3When you change colors, fonts, or spacing down the road, update brand.md first. Never let Claude drift away from your brand.
Why every page matches
That is the whole thing. Run the prompt. Answer the questions. Save brand.md. Every page Claude Code builds from here on out looks intentional. Same fonts. Same spacing. Same voice. The kind of work that looks like a designer built it, but it is just you and Claude Code.
Want more files like this that turn Claude Code into your personal design team?
The Claude Code Course
Liked this? There's 50x more in the course.
- Getting Started setup guide + prompts
- Quick Wins library (growing monthly)
- Step-by-step website and dashboard builds
- All future sections + updates forever
$47 once. Keep forever. Full refund within 14 days.