Websites

Generate complete, responsive websites from a single prompt and preview them instantly.

Overview

Iris can build fully functional web pages directly from your descriptions. Whether you need a quick landing page for a product launch, a portfolio site, or a multi-section business page, Iris generates production-quality HTML, CSS, and JavaScript that you can preview live and download.

Technology Stack

Generated websites use modern, standards-compliant web technologies:

HTML5 — semantic markup for accessibility and SEO.
CSS3 — modern layouts using Flexbox and Grid, with smooth animations and transitions.
JavaScript — vanilla JS for interactivity such as navigation toggles, scroll effects, and form handling.

Responsive Design

Every generated website is fully responsive out of the box. Iris uses mobile-first CSS with breakpoints for tablet and desktop viewports, so your site looks great on any device. Navigation collapses into a hamburger menu on small screens, images scale proportionally, and layouts reflow automatically.

Sandbox Preview

Iris renders your website in a sandboxed live preview directly within the chat interface. You can interact with the site, click links, test navigation, and resize the viewport to verify responsiveness — all without leaving the conversation.

💡 Pro Tip: After previewing, ask Iris to tweak specific sections like "make the hero section taller" or "change the color scheme to blue" for instant visual iteration.

Example Prompts

"Build a modern landing page for a SaaS product called TaskFlow. Include a hero section, features grid, pricing table, and footer with social links."

"Create a personal portfolio website with a dark theme, an about section, project gallery with hover effects, and a contact form."

"Generate a restaurant website with a menu page, image gallery, reservation section, and Google Maps embed placeholder."

Types of Sites

Iris excels at generating these common website types:

Landing pages — conversion-focused single pages with CTAs and social proof.
Portfolios — personal or agency showcases with project galleries.
Business sites — multi-section company pages with about, services, team, and contact sections.
Event pages — countdown timers, schedules, speaker bios, and registration forms.

Best Practices

Describe the structure — list the sections you want (hero, features, pricing, etc.) for a more accurate result.
Specify a color palette — mention brand colors or a general mood (dark, vibrant, corporate) to guide the design.
Provide real content — paste actual copy, logos, and image URLs instead of relying on placeholder text.
Test the preview — interact with the sandbox preview before downloading to catch layout issues early.