Every AI website generator has the same problem: the output looks random. You prompt for a bakery site and get something that could be a SaaS landing page with a different color. The architecture underneath doesn't actually understand type.
I spent two weeks rebuilding how CapsuleWeb resolves visual identity, and the core decision was replacing open-ended style generation with six curated theme families.
The Six Families
- clean-editorial — whitespace-forward, type-heavy, minimal color
- modern-product — sharp contrast, geometric, tech-native
- soft-playful — rounded corners, warm palette, approachable
- boutique-warm — textured, earthy, small-business feel
- utility-local — dense, information-first, no-nonsense
- elegant-dark — dark backgrounds, refined type, high contrast
Each family defines font pairings (Outfit, Fraunces, and others properly wired through the renderer), color logic, spacing ratios, and component behavior. When a user types a prompt, the system runs resolveThemeFamily(archetype + vibe + color) to match intent to family before any layout generation starts.
Why This Matters Technically
Before this, the 586-line monolithic renderer tried to handle every visual decision inline. I broke it into 11 focused components, each aware of which theme family it's operating under. A button in boutique-warm has different padding, border-radius, and hover behavior than the same button in utility-local.
This isn't cosmetic. It's structural. The theme family constrains the decision space so the AI generates coherent pages instead of statistically average ones.
The Gradient Problem
One specific fix: I killed gradient sludge across all outputs. Earlier generations loved throwing muddy linear gradients on hero sections regardless of context. Now gradient use is family-gated — elegant-dark gets subtle gradients, clean-editorial gets none, soft-playful gets them only on accent elements.
What Changed in Output Quality
A restaurant prompt now reliably lands in boutique-warm or utility-local depending on the vibe words used. A portfolio prompt resolves to clean-editorial or modern-product. The outputs feel like they belong to a category instead of floating in generic AI space.
The whole generation still takes about 30 seconds and costs $1 with no account required. But the visual coherence gap between this and what shipped a month ago is significant.
Constraining the design system made the AI better at its job. Fewer choices, better pages.
Top comments (0)