Website References

Instead of describing a design style in words, show VoxelSite an example. Paste any public website URL and VoxelSite will interpret its design language — colors, typography, spacing, layout patterns, section structure — and build a site inspired by that look. The result is an original interpretation, not a pixel-perfect copy — think of it as showing a designer a reference and saying "something like this."

This works for two scenarios:

• New sites — "I like how Apple's website looks, build me something like that for my agency"
• Restyling existing sites — "Restyle my site to look like this reference" while keeping your content

How to use it

Attaching a reference

1. Click the globe icon (🌐) in the prompt toolbar, next to the image attachment button
2. Enter the website URL — full paths work too (e.g. https://www.apple.com/apple-vision-pro/)
3. Click Add — VoxelSite validates the URL in real time (checks accessibility, robots.txt, and content quality)
4. A reference chip appears below the prompt bar showing the URL
5. Hit send — that's it. No additional text prompt is required. The AI understands the reference and gets to work

You can optionally type extra instructions alongside the reference ("make it darker", "keep my existing colors"), but the URL alone is enough.

The globe icon lights up (orange accent) while the URL sheet is open and while a reference is attached, so you always know a reference is active.

For new sites

When you have no site yet, just attach a reference URL and hit send. You can optionally add a description of your business:

Make a site for my creative agency NowSquare

With www.apple.com/apple-vision-pro/ attached as a reference, VoxelSite will interpret Apple's clean typography, spacing rhythm, and layout patterns and build something in that spirit — with original content about NowSquare. The result captures the feel and design language, not an exact copy.

For existing sites (restyle)

When your site already exists, attaching a reference URL triggers a restyle. VoxelSite will:

• Interpret the reference site's visual language
• Transform your site's design to reflect that style — colors, typography, spacing, border radius, shadows
• Keep your existing content — your text, pages, and business information stay intact
• Automatically save a backup of your current design before making changes

You can optionally add instructions to guide the restyle:

Make the typography lighter — match the thin font weights from the reference

Keep my dark background but use their spacing and section layout

Reference + images + text

Website references combine with other attachments. You can send a reference URL, attach images, and type instructions — all in one message.

What gets extracted

VoxelSite extracts the design language, not the content:

The reference site's content is never copied. VoxelSite generates original content based on your business context (site name, tagline, any details you've shared in the conversation).

Regardless of what the reference site uses — Bootstrap, custom CSS, inline styles, or any other approach — VoxelSite always produces clean Tailwind CSS output. The AI interprets the visual design and translates it into VoxelSite's own architecture.

Content modes

When attaching a reference, a toggle appears:

• Generate new content (default) — VoxelSite creates original content based on your business
• Preserve original content (paraphrased) — the reference site's content structure is adapted and paraphrased for your context

Even in preserve mode, content is paraphrased for copyright safety and adapted to your business — it is never copied verbatim.

URL validation

VoxelSite validates every URL before you commit to a generation:

• Invalid URLs — format errors are caught immediately
• Blocked sites — pages protected by Cloudflare, CAPTCHA, or login walls are detected and explained
• JavaScript-only apps — React, Vue, and Angular SPAs that require a browser to render are flagged with a clear message
• robots.txt — VoxelSite respects the site's robots.txt rules

Validation feedback appears as an inline error below the URL field — not as a disruptive popup.

Supported URLs

Website references work with any publicly accessible page that returns rendered HTML:

• ✅ Corporate sites, portfolios, agency pages, landing pages
• ✅ Subpages and specific sections (e.g. www.apple.com/apple-vision-pro/)
• ✅ Sites in any language
• ❌ Pages behind login walls or paywalls
• ❌ Single-page JavaScript apps (React/Vue/Angular) with no server-rendered content
• ❌ Pages blocked by Cloudflare or similar bot protection

If a URL doesn't work, VoxelSite explains why and suggests trying a different page.

History

Website references are saved in your conversation history. When you revisit a conversation, each message that used a reference shows a clickable globe badge with the reference URL — so you always know which design inspired each generation.

Design safety

Before a restyle, VoxelSite automatically saves your current design as a safety backup. If you don't like the result, you can restore your previous design from the Design Library.

You can also save your current design manually using the Save button in the preview toolbar before experimenting with references.

Tips

• Be specific with the URL. Subpages often have more distinctive design than homepages. www.apple.com/apple-vision-pro/ has more character than just apple.com.
• The URL alone is enough. You don't need to type a prompt — just attach and send. Add instructions only when you want to steer the result ("keep my dark colors", "make the typography lighter").
• It's an interpretation, not a clone. VoxelSite captures the spirit and design language of the reference — the overall feel, not every pixel. Results are original VoxelSite output.
• Iterate. If the first result doesn't quite capture what you're after, send a follow-up prompt referencing specific elements: "The heading font should be lighter" or "Add more whitespace between sections."
• Save before experimenting. Click Save in the toolbar before attaching a bold reference, so you can always go back.

What this is not

Website references are a design tool, not a copying tool:

• Not a site scraper or content cloner
• Not a pixel-perfect reproduction tool
• Not an image downloader
• All generated code is original VoxelSite output

It works like showing a designer an example: "I like websites like this. Build me something similar." The designer takes inspiration from the style — not the content.

Related

• Chat — The AI conversation interface
• Creating Sites — Prompts for building from scratch
• Design Styles — Verbal style descriptions as an alternative to references
• Designs — Save and restore design states