Wireframes.online

Open-Source AI Wireframe Prompt Generator for Designers & Developers

Instantly generate detailed, copy-ready wireframe prompts for Midjourney, DALL-E 3, Figma AI, Stable Diffusion, ChatGPT, Google Gemini, and 10+ other AI tools — completely free, open-source, and privacy-first.

Why Wireframes.online?

Building UI wireframes with AI tools is powerful — but writing the right prompt is the hardest part. A vague prompt gives you a vague result. Wireframes.online solves this by letting you visually configure every detail — category, page type, fidelity, color scheme, typography, device target — and then generates a perfectly structured prompt you can paste directly into any AI tool.

No signup. No tracking. No paywall. Just prompts.

✨ What You Get

🚀 Try It Live

→ wireframes.online — Start generating prompts instantly, no installation needed.

📦 Install via npm

npm install wireframes-online

The npm package includes the production-ready dist/ folder with minified HTML, obfuscated JS, optimized CSS, and auto-generated sitemaps.

🛠️ Local Development

Prerequisites

• Bun v1.3+ (JavaScript runtime & bundler)

Quick Start

# Clone the repository
git clone https://github.com/wireframes-online/wireframes.online.git
cd wireframes.online

# Install dependencies
bun install

# Development build (unminified, no obfuscation)
bun run dev

# Production build (minified + obfuscated + sitemaps)
bun run build

What the Build Does

The bun run build command outputs a complete production site to dist/ with:

• HTML Minification — Removes whitespace, comments, collapses attributes
• JavaScript Obfuscation — Protects source code with identifier mangling
• SEO Auto-generation — Creates sitemap.xml, sitemap.txt, and robots.txt
• Structured Data — Injects JSON-LD schema markup into every page
• Open Graph & Twitter Cards — Full social media preview metadata
• Canonical URLs — Proper canonical tags for every page

🎨 Supported AI Tools

Each tool has a dedicated page with prompts optimized for that platform's specific syntax and capabilities:

📁 Repository Structure

wireframes.online/
├── index.html                          # Main prompt generator application
├── style.css                           # Global stylesheet (light + dark themes)
├── script.js                           # Client-side application logic
├── data.json                           # Categories, subcategories, templates
├── global_metadata.json                # Per-page SEO metadata
├── build.js                            # Bun production build script
├── about.html                          # About page
├── contact.html                        # Contact page
├── privacy.html                        # Privacy policy
├── disclaimer.html                     # Disclaimer
├── 404.html                            # Custom 404 page
├── *-ui-design-ai-prompt.html          # 17 AI tool-specific prompt pages
├── assets/                             # Images, icons, OG images
├── webfonts/                           # Font Awesome webfonts
└── dist/                               # Production build output

🤝 Contributing

We welcome contributions! Whether it's a bug fix, a new AI tool page, or a new wireframe category — every contribution helps the community.

1. Read the Contributing Guide
2. Fork → Branch → Commit → Pull Request
3. See the Code of Conduct

Quick Contribution Ideas

• Add a new wireframe category to data.json
• Create a prompt page for a new AI tool
• Improve prompt generation algorithms in script.js
• Add translations / i18n support
• Report bugs or suggest features via Issues

📄 License

MIT License — see LICENSE for full text. Use it, modify it, distribute it freely.

🔗 Links

Built with ❤️ by the Wireframes.online team
_{If this tool helps you, consider giving it a ⭐ on GitHub!}