Design from a reference

Design-from-a-reference is design taste inside Genesis: paste a reference URL and say what you want, and Genesis studies that design — its colors, typography, and feel — then builds you a polished, original page inspired by it. It’s the design-taste flow: not a copy, a re-interpretation in your direction.

Inspired, not a clone

This is for “make me something like this, but mine.” If you want a faithful 1:1 copy of a page instead, use Cloning a webpage. Both exist — when you ask for a page inspired by a reference, Genesis takes the inspired-redesign path.

How to trigger it

Just describe it — no special syntax needed. Give Genesis a reference URL and a brief in plain language:

• “Build a clean fintech landing inspired by https://stripe.com, but for my yoga studio”
• “Make it like https://linear.app — minimal, dark, lots of whitespace”
• “Design a page inspired by https://example.com, but luxury, with serif headings, in Russian”

The URL is optional — you can attach a screenshot and just describe it, or describe a style with no reference at all:

• “Design a minimalist Apple-style product page” — description only
• “Make it like this but warmer and friendlier” — with a screenshot attached
• “Design a fresh landing page for me” — bare; describe it when asked

What happens

1. It studies the reference. Genesis captures the page (full-length, sliced so even a long landing stays sharp for analysis) and runs a vision pass to read its palette, accent color, typography, vibe, layout, and section structure — and even its language.
2. It asks a few smart questions — only if needed. When something’s genuinely unclear (the scope, the accent color, the vibe, the language, which sections, whether to pull real images), you get a short design-brief form. Each question is pick a ready answer, type your own, or “Let AI decide.” If the URL + brief already make everything clear, it asks nothing and just builds.
3. It can borrow real assets. Optionally, Genesis pulls real images and the logo off the reference and re-hosts them, so the result feels grounded rather than generic.
4. It builds. You get a new, original page that captures the reference’s design language in your content and direction.

Tips for a great result

• Say what to keep and what to change — “like this, but our brand colors and friendlier copy.” The reference seeds the look; your brief steers it.
• Be directional on vibe — “luxury / minimal / playful / corporate”, a font feeling (serif vs geometric sans), light vs dark.
• Name the language if it’s not English — Genesis matches it.
• Let it ask. The brief form is quick and makes the output far closer to what you pictured — the “Let AI decide” option is always there if you don’t care about a given choice.

Use cases

• “Build me a landing like [a site I admire], but for my business and in my brand colors.”
• “Recreate the feel of this product page — minimal, lots of whitespace — for my app.”
• “Same vibe as this, but luxury and in Russian.”

Tip

This adds a fresh page in the spirit of the reference. To then animate it, just ask Genesis to animate the page; to fine-tune colors and spacing, use the visual editor.