Skip to main content

FAQ

Common questions about Pixello, answered.

General​

Is Pixello free?​

Pixello is currently free to use. We're focused on building the best developer experience possible. As we add advanced features like collaboration and usage analytics, we may introduce paid plans, but core functionality will remain free.

Does Pixello replace designers?​

No. Pixello is a developer tool, not a designer replacement. It helps developers:

  • Move faster from idea to implementation
  • Iterate on designs without leaving their editor
  • Keep design and code in sync

Designers can still use Figma or other tools. Pixello bridges the gap between design and code, making it easier for developers to implement designs.

Where are my files stored?​

All files are stored locally in your repository. Pixello doesn't store your designs or code in the cloud. Everything lives in your project directory:

  • Design JSON files in designs/ or pixello/
  • Generated code in your app/ or components/ directories
  • All files are version-controlled with Git

Does Pixello work offline?​

Yes, for basic editing. Once installed, you can:

  • Edit designs in the canvas
  • Modify generated code
  • Work with design JSON files

AI generation requires internet because it uses the MCP server. But once designs are created, you can work on them offline.

Is Pixello open source?​

Pixello is not currently open source. However:

  • Design JSON is an open format (just JSON)
  • No vendor lock-in
  • You own all your files
  • Can export designs if needed

We're considering open-sourcing parts of Pixello in the future.

Technical​

What file formats does Pixello use?​

Pixello uses Design JSON—a human-readable JSON format that describes your designs. It's:

  • Plain text (not binary)
  • Version-controllable
  • Editable in any text editor
  • No proprietary format

Does Pixello work with TypeScript?​

Yes! Pixello generates TypeScript-compatible code and works best with TypeScript projects. Generated components include proper types.

What frameworks does Pixello support?​

Pixello currently supports:

  • ✅ Next.js (App Router and Pages Router)
  • ✅ React (with any build tool)
  • ⏳ Vue (coming soon)
  • ⏳ Svelte (coming soon)

Can I use Pixello with existing projects?​

Yes! Pixello works with existing projects. You can:

  • Add new pages designed with Pixello
  • Integrate Pixello components into existing code
  • Use Pixello alongside other tools

Just make sure you're using a supported framework (Next.js or React).

How does Pixello handle conflicts?​

Pixello uses Design JSON as the source of truth. If you edit both the canvas and code:

  1. Canvas edits update Design JSON
  2. Code edits can update Design JSON (on save)
  3. The last write wins
  4. Code regenerates to match Design JSON

For complex conflicts, Git handles version control as usual.

MCP Server​

What is the MCP server?​

The MCP (Model Context Protocol) server is Pixello's AI brain. It:

  • Processes your prompts
  • Generates designs and code
  • Orchestrates AI operations
  • Runs at mcp.pixello.tech

👉 Learn more: MCP Server

Do I need the MCP server?​

Not for basic editing. You can:

  • Edit existing designs
  • Modify generated code
  • Work with design JSON files

MCP is required for:

  • AI-powered design generation
  • Intelligent code generation
  • Future features (collaboration, analytics)

Is my data sent to the MCP server?​

The MCP server processes your prompts and generates designs, but:

  • No data is stored: The server doesn't save your designs or code
  • No personal information: Only your prompts are sent
  • Local-first: All files are written to your repository

Web Canvas​

What is the web canvas?​

The web canvas is Pixello's visual editor. It:

  • Renders your designs visually
  • Lets you edit designs by clicking and dragging
  • Runs at studio.pixello.tech
  • Opens in a webview in your editor

👉 Learn more: Web Canvas

Can I use the canvas without the extension?​

The canvas is designed to work with the extension. While you can access studio.pixello.tech directly, you'll need the extension to:

  • Generate designs from prompts
  • Sync with your code
  • Manage design JSON files

Why does the canvas run in a webview?​

Web-based editors are:

  • Familiar to developers
  • Cross-platform (works on Mac, Windows, Linux)
  • Easy to update
  • Rich in features

The webview makes it feel like part of your editor.

Troubleshooting​

The extension isn't working​

Try:

  1. Reload the window: ⌘+R (Mac) or Ctrl+R (Windows/Linux)
  2. Check installation: Verify the extension is installed and enabled
  3. Check logs: Open Output panel and look for Pixello messages
  4. Reinstall: Uninstall and reinstall the extension

Designs aren't generating​

Check:

  1. Internet connection: MCP server requires internet
  2. MCP server status: Visit mcp.pixello.tech
  3. Project setup: Make sure you're in a valid Next.js/React project
  4. Extension logs: Check for error messages

Canvas won't open​

Try:

  1. Check design JSON: Make sure you have a design file
  2. Reload window: Sometimes a reload fixes webview issues
  3. Check permissions: Ensure the extension can access your files
  4. Try manual open: Use Command Palette to open canvas manually

Code isn't syncing​

Verify:

  1. Design JSON exists: Check that the file is in your project
  2. File watching: Extension should detect changes automatically
  3. MCP server: Ensure the server is running and accessible
  4. Check logs: Look for sync errors in the Output panel

Getting Help​

Where can I get support?​

  • Documentation: This site has all the guides you need
  • GitHub: github.com/pixello-dev (for issues and discussions)
  • Extension: Check the extension's README for specific help

How do I report a bug?​

  1. Check if it's a known issue
  2. Gather details (error messages, steps to reproduce)
  3. Open an issue on GitHub (if public) or contact support

Can I request a feature?​

Yes! We'd love to hear your ideas. Feature requests help us prioritize what to build next.

Still Have Questions?​

If you can't find what you're looking for: