Varelyo

Varelyo is a local-first AI design and prototyping tool for React. Describe a screen or complete product flow in chat and turn your idea into an interactive prototype built with reusable components and a design system.

Start from scratch or build on what you already have. Use ready-made components from shadcn/ui or Varelyo Foundation, or connect your existing React project. Varelyo understands component APIs, props, variants, and design tokens, reusing and extending them instead of creating duplicates.

Turn existing designs into a product. Import Figma designs, HTML/CSS pages, or AI-generated interfaces and transform them into structured React screens, reusable components, and shared design tokens. What starts as a single page can become the foundation for an entire product.

Prototype and refine with AI. Create multi-screen flows, test interactions in a live preview, and make changes through chat or visual editing. Select elements to inspect their components, adjust supported properties, or give AI precise context for the next change.

Build and maintain your design system. Manage components, variants, stories, and design tokens for colors, typography, spacing, and more. Varelyo keeps changes consistent through shared tokens and built-in validation, with Git support for reviewing code changes.

From prototype to production, without a handoff. Varelyo works directly with React source code, so developers can continue in the same project, adding business logic, routing, data, and backend integrations without rebuilding the UI.

Varelyo runs locally on macOS and works with Claude Code, Codex, and other supported AI agents using your existing AI access.

Start free with 5 prompts, no sign-up required.